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

package/lib/cjs/components/grouped-image/GroupedImage.styles.js

@@ -0,0 +1,125 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledGroupedImage = exports.StyledGroupImageElement = exports.StyledCornerImage = exports.StyledCornerElement = void 0;
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const StyledGroupedImage = exports.StyledGroupedImage = _styledComponents.default.div`
+    flex: 0 0 auto;
+    height: ${({
+  $height
+}) => $height}px;
+    position: relative;
+    width: ${({
+  $height
+}) => $height}px;
+`;
+const StyledGroupImageElement = exports.StyledGroupImageElement = _styledComponents.default.div`
+    aspect-ratio: 1;
+    border-radius: ${({
+  $shouldShowRoundImage
+}) => $shouldShowRoundImage ? '50%' : '0'};
+    position: absolute;
+    overflow: hidden;
+
+    ${({
+  $hasMultipleImages,
+  $isSecondImage
+}) => {
+  if (!$hasMultipleImages) {
+    return (0, _styledComponents.css)`
+                height: 100%;
+            `;
+  }
+  if ($isSecondImage) {
+    return (0, _styledComponents.css)`
+                height: 80%;
+            `;
+  }
+  return (0, _styledComponents.css)`
+            height: 76%;
+        `;
+}}
+
+    ${({
+  $isSecondImage
+}) => $isSecondImage ? (0, _styledComponents.css)`
+                  bottom: 0;
+                  right: 0;
+              ` : (0, _styledComponents.css)`
+                  top: 0;
+                  left: 0;
+              `}
+
+    ${({
+  $isSecondImage,
+  $hasMultipleImages,
+  $hasCornerImage,
+  $uuid
+}) => {
+  if ($isSecondImage && $hasCornerImage || !$isSecondImage && !$hasMultipleImages && $hasCornerImage) {
+    return (0, _styledComponents.css)`
+                clip-path: url(${`#care-of-mask--${$uuid}`});
+            `;
+  }
+  if (!$isSecondImage && $hasMultipleImages) {
+    return (0, _styledComponents.css)`
+                clip-path: url(${`#second-image-mask--${$uuid}`});
+            `;
+  }
+  return '';
+}}
+
+    ${({
+  $background,
+  $shouldPreventBackground,
+  theme
+}) => !$shouldPreventBackground && (0, _styledComponents.css)`
+            background: ${$background || `rgba(${theme['text-rgb'] ?? '0,0,0'}, 0.1)`};
+            box-shadow: 0 0 0 1px rgba(${theme['009-rgb']}, 0.08) inset;
+        `}
+    
+    img {
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+    }
+`;
+const StyledCornerImage = exports.StyledCornerImage = _styledComponents.default.img`
+    aspect-ratio: 1;
+    bottom: 0;
+    height: ${({
+  $hasMultipleImages
+}) => $hasMultipleImages ? '28%' : '38%'};
+    position: absolute;
+    right: 0;
+
+    ${({
+  $background,
+  $shouldPreventBackground,
+  theme
+}) => !$shouldPreventBackground && (0, _styledComponents.css)`
+            background: ${$background || `rgba(${theme['text-rgb'] ?? '0,0,0'}, 0.1)`};
+            box-shadow: 0 0 0 1px rgba(${theme['009-rgb']}, 0.08) inset;
+        `}
+`;
+const StyledCornerElement = exports.StyledCornerElement = _styledComponents.default.span`
+    height: 18px;
+    width: 18px;
+    position: absolute;
+    bottom: 0;
+    right: -5px;
+
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    & > * {
+        max-height: 100%;
+        max-width: 100%;
+        display: block;
+    }
+`;
+//# sourceMappingURL=GroupedImage.styles.js.map

package/lib/cjs/components/grouped-image/GroupedImage.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GroupedImage.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","StyledGroupedImage","exports","styled","div","$height","StyledGroupImageElement","$shouldShowRoundImage","$hasMultipleImages","$isSecondImage","css","$hasCornerImage","$uuid","$background","$shouldPreventBackground","theme","StyledCornerImage","img","StyledCornerElement","span"],"sources":["../../../../src/components/grouped-image/GroupedImage.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { CSSProperties } from 'react';\nimport { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledGroupedImageProps = WithTheme<{\n    $height: CSSProperties['height'];\n}>;\n\nexport const StyledGroupedImage = styled.div<StyledGroupedImageProps>`\n    flex: 0 0 auto;\n    height: ${({ $height }) => $height}px;\n    position: relative;\n    width: ${({ $height }) => $height}px;\n`;\n\ntype StyledImageProps = WithTheme<{\n    $background?: CSSProperties['background'];\n    $isSecondImage?: boolean;\n    $shouldPreventBackground?: boolean;\n    $shouldShowRoundImage?: boolean;\n    $hasCornerImage: boolean;\n    $hasMultipleImages: boolean;\n    $uuid: string;\n}>;\n\nexport const StyledGroupImageElement = styled.div<StyledImageProps>`\n    aspect-ratio: 1;\n    border-radius: ${({ $shouldShowRoundImage }) => ($shouldShowRoundImage ? '50%' : '0')};\n    position: absolute;\n    overflow: hidden;\n\n    ${({ $hasMultipleImages, $isSecondImage }) => {\n        if (!$hasMultipleImages) {\n            return css`\n                height: 100%;\n            `;\n        }\n\n        if ($isSecondImage) {\n            return css`\n                height: 80%;\n            `;\n        }\n\n        return css`\n            height: 76%;\n        `;\n    }}\n\n    ${({ $isSecondImage }) =>\n        $isSecondImage\n            ? css`\n                  bottom: 0;\n                  right: 0;\n              `\n            : css`\n                  top: 0;\n                  left: 0;\n              `}\n\n    ${({ $isSecondImage, $hasMultipleImages, $hasCornerImage, $uuid }) => {\n        if (\n            ($isSecondImage && $hasCornerImage) ||\n            (!$isSecondImage && !$hasMultipleImages && $hasCornerImage)\n        ) {\n            return css`\n                clip-path: url(${`#care-of-mask--${$uuid}`});\n            `;\n        }\n\n        if (!$isSecondImage && $hasMultipleImages) {\n            return css`\n                clip-path: url(${`#second-image-mask--${$uuid}`});\n            `;\n        }\n\n        return '';\n    }}\n\n    ${({ $background, $shouldPreventBackground, theme }) =>\n        !$shouldPreventBackground &&\n        css`\n            background: ${$background || `rgba(${theme['text-rgb'] ?? '0,0,0'}, 0.1)`};\n            box-shadow: 0 0 0 1px rgba(${theme['009-rgb']}, 0.08) inset;\n        `}\n    \n    img {\n        width: 100%;\n        height: 100%;\n        object-fit: cover;\n    }\n`;\n\ntype StyledCornerImageProps = WithTheme<{\n    $background?: CSSProperties['background'];\n    $shouldPreventBackground?: boolean;\n    $hasMultipleImages: boolean;\n}>;\n\nexport const StyledCornerImage = styled.img<StyledCornerImageProps>`\n    aspect-ratio: 1;\n    bottom: 0;\n    height: ${({ $hasMultipleImages }) => ($hasMultipleImages ? '28%' : '38%')};\n    position: absolute;\n    right: 0;\n\n    ${({ $background, $shouldPreventBackground, theme }) =>\n        !$shouldPreventBackground &&\n        css`\n            background: ${$background || `rgba(${theme['text-rgb'] ?? '0,0,0'}, 0.1)`};\n            box-shadow: 0 0 0 1px rgba(${theme['009-rgb']}, 0.08) inset;\n        `}\n`;\n\nexport const StyledCornerElement = styled.span`\n    height: 18px;\n    width: 18px;\n    position: absolute;\n    bottom: 0;\n    right: -5px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    & > * {\n        max-height: 100%;\n        max-width: 100%;\n        display: block;\n    }\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,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;AAQzC,MAAMkB,kBAAkB,GAAAC,OAAA,CAAAD,kBAAA,GAAGE,yBAAM,CAACC,GAA4B;AACrE;AACA,cAAc,CAAC;EAAEC;AAAQ,CAAC,KAAKA,OAAO;AACtC;AACA,aAAa,CAAC;EAAEA;AAAQ,CAAC,KAAKA,OAAO;AACrC,CAAC;AAYM,MAAMC,uBAAuB,GAAAJ,OAAA,CAAAI,uBAAA,GAAGH,yBAAM,CAACC,GAAqB;AACnE;AACA,qBAAqB,CAAC;EAAEG;AAAsB,CAAC,KAAMA,qBAAqB,GAAG,KAAK,GAAG,GAAI;AACzF;AACA;AACA;AACA,MAAM,CAAC;EAAEC,kBAAkB;EAAEC;AAAe,CAAC,KAAK;EAC1C,IAAI,CAACD,kBAAkB,EAAE;IACrB,OAAO,IAAAE,qBAAG;AACtB;AACA,aAAa;EACL;EAEA,IAAID,cAAc,EAAE;IAChB,OAAO,IAAAC,qBAAG;AACtB;AACA,aAAa;EACL;EAEA,OAAO,IAAAA,qBAAG;AAClB;AACA,SAAS;AACL,CAAC;AACL;AACA,MAAM,CAAC;EAAED;AAAe,CAAC,KACjBA,cAAc,GACR,IAAAC,qBAAG;AACjB;AACA;AACA,eAAe,GACD,IAAAA,qBAAG;AACjB;AACA;AACA,eAAe;AACf;AACA,MAAM,CAAC;EAAED,cAAc;EAAED,kBAAkB;EAAEG,eAAe;EAAEC;AAAM,CAAC,KAAK;EAClE,IACKH,cAAc,IAAIE,eAAe,IACjC,CAACF,cAAc,IAAI,CAACD,kBAAkB,IAAIG,eAAgB,EAC7D;IACE,OAAO,IAAAD,qBAAG;AACtB,iCAAiC,kBAAkBE,KAAK,EAAE;AAC1D,aAAa;EACL;EAEA,IAAI,CAACH,cAAc,IAAID,kBAAkB,EAAE;IACvC,OAAO,IAAAE,qBAAG;AACtB,iCAAiC,uBAAuBE,KAAK,EAAE;AAC/D,aAAa;EACL;EAEA,OAAO,EAAE;AACb,CAAC;AACL;AACA,MAAM,CAAC;EAAEC,WAAW;EAAEC,wBAAwB;EAAEC;AAAM,CAAC,KAC/C,CAACD,wBAAwB,IACzB,IAAAJ,qBAAG;AACX,0BAA0BG,WAAW,IAAI,QAAQE,KAAK,CAAC,UAAU,CAAC,IAAI,OAAO,QAAQ;AACrF,yCAAyCA,KAAK,CAAC,SAAS,CAAC;AACzD,SAAS;AACT;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAQM,MAAMC,iBAAiB,GAAAd,OAAA,CAAAc,iBAAA,GAAGb,yBAAM,CAACc,GAA2B;AACnE;AACA;AACA,cAAc,CAAC;EAAET;AAAmB,CAAC,KAAMA,kBAAkB,GAAG,KAAK,GAAG,KAAM;AAC9E;AACA;AACA;AACA,MAAM,CAAC;EAAEK,WAAW;EAAEC,wBAAwB;EAAEC;AAAM,CAAC,KAC/C,CAACD,wBAAwB,IACzB,IAAAJ,qBAAG;AACX,0BAA0BG,WAAW,IAAI,QAAQE,KAAK,CAAC,UAAU,CAAC,IAAI,OAAO,QAAQ;AACrF,yCAAyCA,KAAK,CAAC,SAAS,CAAC;AACzD,SAAS;AACT,CAAC;AAEM,MAAMG,mBAAmB,GAAAhB,OAAA,CAAAgB,mBAAA,GAAGf,yBAAM,CAACgB,IAAI;AAC9C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/lib/cjs/components/grouped-image/clip-paths/CareOfClipPath.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _groupedImage = require("../../../utils/groupedImage");
+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 CareOfClipPath = ({
+  imageFactors,
+  height,
+  uuid
+}) => {
+  const d = (0, _react.useMemo)(() => (0, _groupedImage.createCareOfClipPath)({
+    height,
+    imageFactors
+  }), [height, imageFactors]);
+  return /*#__PURE__*/_react.default.createElement("svg", {
+    width: "0",
+    height: "0",
+    style: {
+      position: 'absolute'
+    }
+  }, /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("clipPath", {
+    id: `care-of-mask--${uuid}`,
+    clipPathUnits: "objectBoundingBox"
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    d: d
+  }))));
+};
+CareOfClipPath.dsiplayName = 'CareOfClipPath';
+var _default = exports.default = CareOfClipPath;
+//# sourceMappingURL=CareOfClipPath.js.map

package/lib/cjs/components/grouped-image/clip-paths/CareOfClipPath.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CareOfClipPath.js","names":["_react","_interopRequireWildcard","require","_groupedImage","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","CareOfClipPath","imageFactors","height","uuid","d","useMemo","createCareOfClipPath","createElement","width","style","position","id","clipPathUnits","dsiplayName","_default","exports"],"sources":["../../../../../src/components/grouped-image/clip-paths/CareOfClipPath.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { createCareOfClipPath } from '../../../utils/groupedImage';\n\nconst CareOfClipPath = ({\n    imageFactors,\n    height,\n    uuid,\n}: {\n    imageFactors: number[];\n    height: number;\n    uuid: string;\n}) => {\n    const d = useMemo(() => createCareOfClipPath({ height, imageFactors }), [height, imageFactors]);\n\n    return (\n        <svg width=\"0\" height=\"0\" style={{ position: 'absolute' }}>\n            <defs>\n                <clipPath id={`care-of-mask--${uuid}`} clipPathUnits=\"objectBoundingBox\">\n                    <path d={d} />\n                </clipPath>\n            </defs>\n        </svg>\n    );\n};\n\nCareOfClipPath.dsiplayName = 'CareOfClipPath';\n\nexport default CareOfClipPath;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AAAmE,SAAAD,wBAAAG,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAL,uBAAA,YAAAA,CAAAG,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;AAEnE,MAAMkB,cAAc,GAAGA,CAAC;EACpBC,YAAY;EACZC,MAAM;EACNC;AAKJ,CAAC,KAAK;EACF,MAAMC,CAAC,GAAG,IAAAC,cAAO,EAAC,MAAM,IAAAC,kCAAoB,EAAC;IAAEJ,MAAM;IAAED;EAAa,CAAC,CAAC,EAAE,CAACC,MAAM,EAAED,YAAY,CAAC,CAAC;EAE/F,oBACIxB,MAAA,CAAAc,OAAA,CAAAgB,aAAA;IAAKC,KAAK,EAAC,GAAG;IAACN,MAAM,EAAC,GAAG;IAACO,KAAK,EAAE;MAAEC,QAAQ,EAAE;IAAW;EAAE,gBACtDjC,MAAA,CAAAc,OAAA,CAAAgB,aAAA,4BACI9B,MAAA,CAAAc,OAAA,CAAAgB,aAAA;IAAUI,EAAE,EAAE,iBAAiBR,IAAI,EAAG;IAACS,aAAa,EAAC;EAAmB,gBACpEnC,MAAA,CAAAc,OAAA,CAAAgB,aAAA;IAAMH,CAAC,EAAEA;EAAE,CAAE,CACP,CACR,CACL,CAAC;AAEd,CAAC;AAEDJ,cAAc,CAACa,WAAW,GAAG,gBAAgB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAxB,OAAA,GAE/BS,cAAc","ignoreList":[]}

package/lib/cjs/components/grouped-image/clip-paths/SecondImageClipPath.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _groupedImage = require("../../../utils/groupedImage");
+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 SecondImageClipPath = ({
+  height,
+  uuid,
+  shouldShowRoundImage
+}) => {
+  const d = (0, _react.useMemo)(() => (0, _groupedImage.createSecondImageClipPath)({
+    height,
+    shouldShowRoundImage
+  }), [height, shouldShowRoundImage]);
+  return /*#__PURE__*/_react.default.createElement("svg", {
+    width: "0",
+    height: "0",
+    style: {
+      position: 'absolute'
+    }
+  }, /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("clipPath", {
+    id: `second-image-mask--${uuid}`,
+    clipPathUnits: "objectBoundingBox"
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    d: d
+  }))));
+};
+SecondImageClipPath.dsiplayName = 'SecondImageClipPath';
+var _default = exports.default = SecondImageClipPath;
+//# sourceMappingURL=SecondImageClipPath.js.map

package/lib/cjs/components/grouped-image/clip-paths/SecondImageClipPath.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SecondImageClipPath.js","names":["_react","_interopRequireWildcard","require","_groupedImage","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","SecondImageClipPath","height","uuid","shouldShowRoundImage","d","useMemo","createSecondImageClipPath","createElement","width","style","position","id","clipPathUnits","dsiplayName","_default","exports"],"sources":["../../../../../src/components/grouped-image/clip-paths/SecondImageClipPath.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { createSecondImageClipPath } from '../../../utils/groupedImage';\n\nconst SecondImageClipPath = ({\n    height,\n    uuid,\n    shouldShowRoundImage,\n}: {\n    height: number;\n    uuid: string;\n    shouldShowRoundImage: boolean;\n}) => {\n    const d = useMemo(\n        () => createSecondImageClipPath({ height, shouldShowRoundImage }),\n        [height, shouldShowRoundImage],\n    );\n\n    return (\n        <svg width=\"0\" height=\"0\" style={{ position: 'absolute' }}>\n            <defs>\n                <clipPath id={`second-image-mask--${uuid}`} clipPathUnits=\"objectBoundingBox\">\n                    <path d={d} />\n                </clipPath>\n            </defs>\n        </svg>\n    );\n};\n\nSecondImageClipPath.dsiplayName = 'SecondImageClipPath';\n\nexport default SecondImageClipPath;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AAAwE,SAAAD,wBAAAG,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAL,uBAAA,YAAAA,CAAAG,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;AAExE,MAAMkB,mBAAmB,GAAGA,CAAC;EACzBC,MAAM;EACNC,IAAI;EACJC;AAKJ,CAAC,KAAK;EACF,MAAMC,CAAC,GAAG,IAAAC,cAAO,EACb,MAAM,IAAAC,uCAAyB,EAAC;IAAEL,MAAM;IAAEE;EAAqB,CAAC,CAAC,EACjE,CAACF,MAAM,EAAEE,oBAAoB,CACjC,CAAC;EAED,oBACI1B,MAAA,CAAAc,OAAA,CAAAgB,aAAA;IAAKC,KAAK,EAAC,GAAG;IAACP,MAAM,EAAC,GAAG;IAACQ,KAAK,EAAE;MAAEC,QAAQ,EAAE;IAAW;EAAE,gBACtDjC,MAAA,CAAAc,OAAA,CAAAgB,aAAA,4BACI9B,MAAA,CAAAc,OAAA,CAAAgB,aAAA;IAAUI,EAAE,EAAE,sBAAsBT,IAAI,EAAG;IAACU,aAAa,EAAC;EAAmB,gBACzEnC,MAAA,CAAAc,OAAA,CAAAgB,aAAA;IAAMH,CAAC,EAAEA;EAAE,CAAE,CACP,CACR,CACL,CAAC;AAEd,CAAC;AAEDJ,mBAAmB,CAACa,WAAW,GAAG,qBAAqB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAxB,OAAA,GAEzCS,mBAAmB","ignoreList":[]}

package/lib/cjs/components/highlight-slider/HighlightSlider.js

@@ -0,0 +1,49 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _HighlightSlider = require("./HighlightSlider.styles");
+var _HighlightSliderItem = _interopRequireDefault(require("./highlight-slider-item/HighlightSliderItem"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const DEFAULT_HIGHLIGHT_SLIDER_COLORS = {
+  backgroundColor: '#E0E0E0',
+  fillColor: '#808080'
+};
+const HighlightSlider = ({
+  count,
+  colors = DEFAULT_HIGHLIGHT_SLIDER_COLORS,
+  onIndexChange,
+  currentIndex,
+  duration = 10
+}) => {
+  const handleFinish = (0, _react.useCallback)(index => {
+    if (typeof onIndexChange === 'function') {
+      onIndexChange(index >= count - 1 ? 0 : index + 1);
+    }
+  }, [count, onIndexChange]);
+  const handleClick = (0, _react.useCallback)(index => {
+    if (typeof onIndexChange === 'function') {
+      onIndexChange(index);
+    }
+  }, [onIndexChange]);
+  const content = (0, _react.useMemo)(() => Array.from({
+    length: count
+  }).map((value, index) => /*#__PURE__*/_react.default.createElement(_HighlightSliderItem.default, {
+    key: `highlight-slider-item--${value}`,
+    index: index,
+    duration: duration,
+    colors: colors,
+    isActive: currentIndex === index,
+    isFinished: currentIndex > index,
+    onClick: handleClick,
+    onFinish: handleFinish
+  })), [colors, count, currentIndex, duration, handleClick, handleFinish]);
+  return /*#__PURE__*/_react.default.createElement(_HighlightSlider.StyledHighlightSlider, null, content);
+};
+HighlightSlider.displayName = 'HighlightSlider';
+var _default = exports.default = HighlightSlider;
+//# sourceMappingURL=HighlightSlider.js.map

package/lib/cjs/components/highlight-slider/HighlightSlider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HighlightSlider.js","names":["_react","_interopRequireWildcard","require","_HighlightSlider","_HighlightSliderItem","_interopRequireDefault","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","DEFAULT_HIGHLIGHT_SLIDER_COLORS","backgroundColor","fillColor","HighlightSlider","count","colors","onIndexChange","currentIndex","duration","handleFinish","useCallback","index","handleClick","content","useMemo","Array","from","length","map","value","createElement","key","isActive","isFinished","onClick","onFinish","StyledHighlightSlider","displayName","_default","exports"],"sources":["../../../../src/components/highlight-slider/HighlightSlider.tsx"],"sourcesContent":["import React, { FC, useCallback, useMemo } from 'react';\nimport { StyledHighlightSlider } from './HighlightSlider.styles';\nimport HighlightSliderItem, {\n    HighlightSliderItemColors,\n} from './highlight-slider-item/HighlightSliderItem';\n\nconst DEFAULT_HIGHLIGHT_SLIDER_COLORS: HighlightSliderItemColors = {\n    backgroundColor: '#E0E0E0',\n    fillColor: '#808080',\n};\n\nexport type HighlightSliderProps = {\n    /**\n     * The Colors of the slider.\n     */\n    colors?: HighlightSliderItemColors;\n    /**\n     * The total number of sections, that should be displayed.\n     */\n    count: number;\n    /**\n     * The current index.\n     */\n    currentIndex: number;\n    /**\n     * The duration of the animation of a single item in seconds.\n     */\n    duration?: number;\n    /**\n     * Function to be executed if the index has changed.\n     */\n    onIndexChange?: (index: number) => void;\n};\n\nconst HighlightSlider: FC<HighlightSliderProps> = ({\n    count,\n    colors = DEFAULT_HIGHLIGHT_SLIDER_COLORS,\n    onIndexChange,\n    currentIndex,\n    duration = 10,\n}) => {\n    const handleFinish = useCallback(\n        (index: number) => {\n            if (typeof onIndexChange === 'function') {\n                onIndexChange(index >= count - 1 ? 0 : index + 1);\n            }\n        },\n        [count, onIndexChange],\n    );\n\n    const handleClick = useCallback(\n        (index: number) => {\n            if (typeof onIndexChange === 'function') {\n                onIndexChange(index);\n            }\n        },\n        [onIndexChange],\n    );\n\n    const content = useMemo(\n        () =>\n            Array.from({ length: count }).map((value, index) => (\n                <HighlightSliderItem\n                    key={`highlight-slider-item--${value as number}`}\n                    index={index}\n                    duration={duration}\n                    colors={colors}\n                    isActive={currentIndex === index}\n                    isFinished={currentIndex > index}\n                    onClick={handleClick}\n                    onFinish={handleFinish}\n                />\n            )),\n        [colors, count, currentIndex, duration, handleClick, handleFinish],\n    );\n\n    return <StyledHighlightSlider>{content}</StyledHighlightSlider>;\n};\n\nHighlightSlider.displayName = 'HighlightSlider';\n\nexport default HighlightSlider;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/highlight-slider/HighlightSlider.styles.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledHighlightSlider = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const StyledHighlightSlider = exports.StyledHighlightSlider = _styledComponents.default.div`
+    display: flex;
+    gap: 12px;
+    align-items: center;
+`;
+//# sourceMappingURL=HighlightSlider.styles.js.map

package/lib/cjs/components/highlight-slider/HighlightSlider.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HighlightSlider.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledHighlightSlider","exports","styled","div"],"sources":["../../../../src/components/highlight-slider/HighlightSlider.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledHighlightSlider = styled.div`\n    display: flex;\n    gap: 12px;\n    align-items: center;\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;AAEhC,MAAMG,qBAAqB,GAAAC,OAAA,CAAAD,qBAAA,GAAGE,yBAAM,CAACC,GAAG;AAC/C;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/lib/cjs/components/highlight-slider/highlight-slider-item/HighlightSliderItem.js

@@ -0,0 +1,57 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _HighlightSliderItem = require("./HighlightSliderItem.styles");
+var _ProgressBar = require("../../progress-bar/ProgressBar.styles");
+var _uuid = require("../../../hooks/uuid");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const HighlightSliderItem = ({
+  colors,
+  isActive,
+  isFinished,
+  onFinish,
+  index,
+  onClick,
+  duration
+}) => {
+  const uuid = (0, _uuid.useUuid)();
+  return /*#__PURE__*/_react.default.createElement(_HighlightSliderItem.StyledHighlightSliderItem, {
+    onClick: () => onClick(index)
+  }, /*#__PURE__*/_react.default.createElement(_ProgressBar.StyledProgressBarProgressWrapper, null, isActive && /*#__PURE__*/_react.default.createElement(_HighlightSliderItem.StyledHighlightSliderItemProgress, {
+    key: `highlight-slider-item-active--${uuid}`,
+    initial: {
+      width: '100%',
+      left: '-100%'
+    },
+    animate: {
+      width: '100%',
+      left: '0%'
+    },
+    exit: {
+      width: '100%',
+      left: '0%'
+    },
+    onAnimationComplete: () => onFinish(index),
+    $backgroundColor: colors.fillColor,
+    transition: {
+      ease: 'linear',
+      duration
+    }
+  }), isFinished && /*#__PURE__*/_react.default.createElement(_HighlightSliderItem.StyledHighlightSliderItemProgress, {
+    key: `highlight-slider-item-finished--${uuid}`,
+    style: {
+      width: '100%',
+      left: '0%'
+    },
+    $backgroundColor: colors.fillColor
+  }), /*#__PURE__*/_react.default.createElement(_HighlightSliderItem.StyledHighlightSliderItemBackground, {
+    $backgroundColor: colors.backgroundColor
+  })));
+};
+HighlightSliderItem.displayName = 'HighlightSliderItem';
+var _default = exports.default = HighlightSliderItem;
+//# sourceMappingURL=HighlightSliderItem.js.map

package/lib/cjs/components/highlight-slider/highlight-slider-item/HighlightSliderItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HighlightSliderItem.js","names":["_react","_interopRequireDefault","require","_HighlightSliderItem","_ProgressBar","_uuid","e","__esModule","default","HighlightSliderItem","colors","isActive","isFinished","onFinish","index","onClick","duration","uuid","useUuid","createElement","StyledHighlightSliderItem","StyledProgressBarProgressWrapper","StyledHighlightSliderItemProgress","key","initial","width","left","animate","exit","onAnimationComplete","$backgroundColor","fillColor","transition","ease","style","StyledHighlightSliderItemBackground","backgroundColor","displayName","_default","exports"],"sources":["../../../../../src/components/highlight-slider/highlight-slider-item/HighlightSliderItem.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport {\n    StyledHighlightSliderItem,\n    StyledHighlightSliderItemBackground,\n    StyledHighlightSliderItemProgress,\n} from './HighlightSliderItem.styles';\nimport { StyledProgressBarProgressWrapper } from '../../progress-bar/ProgressBar.styles';\nimport { useUuid } from '../../../hooks/uuid';\n\nexport interface HighlightSliderItemColors {\n    backgroundColor: string;\n    fillColor: string;\n}\n\nexport type HighlightSliderItemProps = {\n    index: number;\n    isActive: boolean;\n    isFinished: boolean;\n    onClick: (index: number) => void;\n    onFinish: (index: number) => void;\n    duration: number;\n    colors: HighlightSliderItemColors;\n};\n\nconst HighlightSliderItem: FC<HighlightSliderItemProps> = ({\n    colors,\n    isActive,\n    isFinished,\n    onFinish,\n    index,\n    onClick,\n    duration,\n}) => {\n    const uuid = useUuid();\n\n    return (\n        <StyledHighlightSliderItem onClick={() => onClick(index)}>\n            <StyledProgressBarProgressWrapper>\n                {isActive && (\n                    <StyledHighlightSliderItemProgress\n                        key={`highlight-slider-item-active--${uuid}`}\n                        initial={{ width: '100%', left: '-100%' }}\n                        animate={{ width: '100%', left: '0%' }}\n                        exit={{ width: '100%', left: '0%' }}\n                        onAnimationComplete={() => onFinish(index)}\n                        $backgroundColor={colors.fillColor}\n                        transition={{\n                            ease: 'linear',\n                            duration,\n                        }}\n                    />\n                )}\n                {isFinished && (\n                    <StyledHighlightSliderItemProgress\n                        key={`highlight-slider-item-finished--${uuid}`}\n                        style={{ width: '100%', left: '0%' }}\n                        $backgroundColor={colors.fillColor}\n                    />\n                )}\n                <StyledHighlightSliderItemBackground $backgroundColor={colors.backgroundColor} />\n            </StyledProgressBarProgressWrapper>\n        </StyledHighlightSliderItem>\n    );\n};\n\nHighlightSliderItem.displayName = 'HighlightSliderItem';\n\nexport default HighlightSliderItem;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,oBAAA,GAAAD,OAAA;AAKA,IAAAE,YAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AAA8C,SAAAD,uBAAAK,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAiB9C,MAAMG,mBAAiD,GAAGA,CAAC;EACvDC,MAAM;EACNC,QAAQ;EACRC,UAAU;EACVC,QAAQ;EACRC,KAAK;EACLC,OAAO;EACPC;AACJ,CAAC,KAAK;EACF,MAAMC,IAAI,GAAG,IAAAC,aAAO,EAAC,CAAC;EAEtB,oBACIlB,MAAA,CAAAQ,OAAA,CAAAW,aAAA,CAAChB,oBAAA,CAAAiB,yBAAyB;IAACL,OAAO,EAAEA,CAAA,KAAMA,OAAO,CAACD,KAAK;EAAE,gBACrDd,MAAA,CAAAQ,OAAA,CAAAW,aAAA,CAACf,YAAA,CAAAiB,gCAAgC,QAC5BV,QAAQ,iBACLX,MAAA,CAAAQ,OAAA,CAAAW,aAAA,CAAChB,oBAAA,CAAAmB,iCAAiC;IAC9BC,GAAG,EAAE,iCAAiCN,IAAI,EAAG;IAC7CO,OAAO,EAAE;MAAEC,KAAK,EAAE,MAAM;MAAEC,IAAI,EAAE;IAAQ,CAAE;IAC1CC,OAAO,EAAE;MAAEF,KAAK,EAAE,MAAM;MAAEC,IAAI,EAAE;IAAK,CAAE;IACvCE,IAAI,EAAE;MAAEH,KAAK,EAAE,MAAM;MAAEC,IAAI,EAAE;IAAK,CAAE;IACpCG,mBAAmB,EAAEA,CAAA,KAAMhB,QAAQ,CAACC,KAAK,CAAE;IAC3CgB,gBAAgB,EAAEpB,MAAM,CAACqB,SAAU;IACnCC,UAAU,EAAE;MACRC,IAAI,EAAE,QAAQ;MACdjB;IACJ;EAAE,CACL,CACJ,EACAJ,UAAU,iBACPZ,MAAA,CAAAQ,OAAA,CAAAW,aAAA,CAAChB,oBAAA,CAAAmB,iCAAiC;IAC9BC,GAAG,EAAE,mCAAmCN,IAAI,EAAG;IAC/CiB,KAAK,EAAE;MAAET,KAAK,EAAE,MAAM;MAAEC,IAAI,EAAE;IAAK,CAAE;IACrCI,gBAAgB,EAAEpB,MAAM,CAACqB;EAAU,CACtC,CACJ,eACD/B,MAAA,CAAAQ,OAAA,CAAAW,aAAA,CAAChB,oBAAA,CAAAgC,mCAAmC;IAACL,gBAAgB,EAAEpB,MAAM,CAAC0B;EAAgB,CAAE,CAClD,CACX,CAAC;AAEpC,CAAC;AAED3B,mBAAmB,CAAC4B,WAAW,GAAG,qBAAqB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA/B,OAAA,GAEzCC,mBAAmB","ignoreList":[]}

package/lib/cjs/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.js

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledHighlightSliderItemProgress = exports.StyledHighlightSliderItemBackground = exports.StyledHighlightSliderItem = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _react = require("motion/react");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const StyledHighlightSliderItem = exports.StyledHighlightSliderItem = _styledComponents.default.div`
+    overflow: hidden;
+    position: relative;
+    width: 100%;
+    height: 4px;
+    border-radius: 4px;
+    cursor: pointer;
+`;
+const StyledHighlightSliderItemProgress = exports.StyledHighlightSliderItemProgress = (0, _styledComponents.default)(_react.motion.div)`
+    height: 4px;
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: 2;
+    background-color: ${({
+  $backgroundColor
+}) => $backgroundColor};
+`;
+const StyledHighlightSliderItemBackground = exports.StyledHighlightSliderItemBackground = (0, _styledComponents.default)(_react.motion.div)`
+    height: 4px;
+    width: 100%;
+    border-radius: 2px;
+    background-color: ${({
+  $backgroundColor
+}) => $backgroundColor};
+`;
+//# sourceMappingURL=HighlightSliderItem.styles.js.map

package/lib/cjs/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HighlightSliderItem.styles.js","names":["_styledComponents","_interopRequireDefault","require","_react","e","__esModule","default","StyledHighlightSliderItem","exports","styled","div","StyledHighlightSliderItemProgress","motion","$backgroundColor","StyledHighlightSliderItemBackground"],"sources":["../../../../../src/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { motion } from 'motion/react';\nimport { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledHighlightSliderItem = styled.div`\n    overflow: hidden;\n    position: relative;\n    width: 100%;\n    height: 4px;\n    border-radius: 4px;\n    cursor: pointer;\n`;\ntype StyledHighlightSliderItemProgressProps = WithTheme<{ $backgroundColor: string }>;\n\nexport const StyledHighlightSliderItemProgress = styled(\n    motion.div,\n)<StyledHighlightSliderItemProgressProps>`\n    height: 4px;\n    position: absolute;\n    top: 0;\n    left: 0;\n    z-index: 2;\n    background-color: ${({ $backgroundColor }: StyledHighlightSliderItemProgressProps) =>\n        $backgroundColor};\n`;\n\ntype StyledHighlightSliderItemBackgroundProps = WithTheme<{ $backgroundColor: string }>;\n\nexport const StyledHighlightSliderItemBackground = styled(\n    motion.div,\n)<StyledHighlightSliderItemBackgroundProps>`\n    height: 4px;\n    width: 100%;\n    border-radius: 2px;\n    background-color: ${({ $backgroundColor }: StyledHighlightSliderItemBackgroundProps) =>\n        $backgroundColor};\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAAsC,SAAAD,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAG/B,MAAMG,yBAAyB,GAAAC,OAAA,CAAAD,yBAAA,GAAGE,yBAAM,CAACC,GAAG;AACnD;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAGM,MAAMC,iCAAiC,GAAAH,OAAA,CAAAG,iCAAA,GAAG,IAAAF,yBAAM,EACnDG,aAAM,CAACF,GACX,CAAyC;AACzC;AACA;AACA;AACA;AACA;AACA,wBAAwB,CAAC;EAAEG;AAAyD,CAAC,KAC7EA,gBAAgB;AACxB,CAAC;AAIM,MAAMC,mCAAmC,GAAAN,OAAA,CAAAM,mCAAA,GAAG,IAAAL,yBAAM,EACrDG,aAAM,CAACF,GACX,CAA2C;AAC3C;AACA;AACA;AACA,wBAAwB,CAAC;EAAEG;AAA2D,CAAC,KAC/EA,gBAAgB;AACxB,CAAC","ignoreList":[]}

package/lib/cjs/components/icon/Icon.js

@@ -6,9 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _clsx = _interopRequireDefault(require("clsx"));
 var _react = _interopRequireDefault(require("react"));
-var _styledComponents = require("styled-components");
 var _icon = require("../../utils/icon");
 var _Icon = require("./Icon.styles");
+var _styledComponents = require("styled-components");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const Icon = ({
   className,
@@ -18,9 +18,11 @@ const Icon = ({
   onClick,
   onDoubleClick,
   onMouseDown,
+  tabIndex,
   size = 15,
   shouldStopPropagation
 }) => {
+  const theme = (0, _styledComponents.useTheme)();
   const handleClick = event => {
     if (shouldStopPropagation) {
       event.stopPropagation();
@@ -37,7 +39,6 @@ const Icon = ({
       onDoubleClick(event);
     }
   };
-  const theme = (0, _styledComponents.useTheme)();
   let maxStackSizeFactor = 1;
   icons.forEach(icon => {
     const stackSizeFactor = (0, _icon.getStackSizeFactor)(icon);
@@ -48,24 +49,19 @@ const Icon = ({
   const shouldUseStackedIcon = icons.length > 1;
   const wrapperClasses = (0, _clsx.default)('beta-chayns-icon', shouldUseStackedIcon ? 'fa-stack' : '', className);
   return /*#__PURE__*/_react.default.createElement(_Icon.StyledIconWrapper, {
+    tabIndex: tabIndex,
     className: wrapperClasses,
     $isDisabled: isDisabled,
-    onClick: typeof onClick === 'function' ? handleClick : undefined,
-    $isOnClick: typeof onClick === 'function',
-    onDoubleClick: typeof onDoubleClick === 'function' ? handleDoubleClick : undefined,
-    onMouseDown: onMouseDown,
+    onClick: typeof onClick === 'function' && !isDisabled ? handleClick : undefined,
+    $isOnClick: typeof onClick === 'function' && !isDisabled,
+    onDoubleClick: typeof onDoubleClick === 'function' && !isDisabled ? handleDoubleClick : undefined,
+    onMouseDown: typeof onMouseDown === 'function' && !isDisabled ? onMouseDown : undefined,
     $size: size
   }, icons.map(icon => {
     const stackSizeFactor = (0, _icon.getStackSizeFactor)(icon);
-
-    // const isIconStyleGiven =
-    //     /fa[srltd]|fa-(?:regular|solid|thin|light|duotone|sharp)/.test(icon);
-    //
-    // const iconStyle = isIconStyleGiven
-    //     ? undefined
-    //     : (theme?.iconStyle as string) ?? 'fa-regular';
-
-    const iconClasses = (0, _clsx.default)(icon, {
+    const iconStyle = `${(theme === null || theme === void 0 ? void 0 : theme.iconStyle) ?? 'fa-regular'} `;
+    const themedIcon = icon === null || icon === void 0 ? void 0 : icon.replace(/^fa\s/, iconStyle);
+    const iconClasses = (0, _clsx.default)(themedIcon, {
       'fa-stack-1x': shouldUseStackedIcon && stackSizeFactor === undefined
     });
     return /*#__PURE__*/_react.default.createElement(_Icon.StyledIcon, {

package/lib/cjs/components/icon/Icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.js","names":["_clsx","_interopRequireDefault","require","_react","_styledComponents","_icon","_Icon","e","__esModule","default","Icon","className","color","icons","isDisabled","onClick","onDoubleClick","onMouseDown","size","shouldStopPropagation","handleClick","event","stopPropagation","handleDoubleClick","theme","useTheme","maxStackSizeFactor","forEach","icon","stackSizeFactor","getStackSizeFactor","shouldUseStackedIcon","length","wrapperClasses","clsx","createElement","StyledIconWrapper","$isDisabled","undefined","$isOnClick","$size","map","iconClasses","StyledIcon","$color","includes","$fontSize","$isStacked","key","displayName","_default","exports"],"sources":["../../../../src/components/icon/Icon.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { FC, MouseEventHandler } from 'react';\nimport { useTheme } from 'styled-components';\nimport { getStackSizeFactor } from '../../utils/icon';\nimport { StyledIcon, StyledIconWrapper } from './Icon.styles';\n\nexport type IconProps = {\n    /**\n     * Additional class names for the root element\n     */\n    className?: string;\n    /**\n     * The color of the icon\n     */\n    color?: string;\n    /**\n     * The FontAwesome or tobit icons to render. Multiple icons are stacked.\n     */\n    icons: string[];\n    /**\n     * Disables the icon so that it cannot be clicked anymore\n     */\n    isDisabled?: boolean;\n    /**\n     * Function to be executed when the icon was clicked\n     */\n    onClick?: MouseEventHandler<HTMLSpanElement>;\n    /**\n     * Function to be executed when the icon was double-clicked\n     */\n    onDoubleClick?: MouseEventHandler<HTMLSpanElement>;\n    /**\n     * Function to be executed when a mouse button is pressed on the icon\n     */\n    onMouseDown?: MouseEventHandler<HTMLSpanElement>;\n    /**\n     * Size of the icon in pixel\n     */\n    size?: number;\n    /**\n     * Stops event propagation on click\n     */\n    shouldStopPropagation?: boolean;\n};\n\nconst Icon: FC<IconProps> = ({\n    className,\n    color,\n    icons,\n    isDisabled,\n    onClick,\n    onDoubleClick,\n    onMouseDown,\n    size = 15,\n    shouldStopPropagation,\n}) => {\n    const handleClick: MouseEventHandler<HTMLSpanElement> = (event) => {\n        if (shouldStopPropagation) {\n            event.stopPropagation();\n        }\n\n        if (typeof onClick === 'function') {\n            onClick(event);\n        }\n    };\n\n    const handleDoubleClick: MouseEventHandler<HTMLSpanElement> = (event) => {\n        if (shouldStopPropagation) {\n            event.stopPropagation();\n        }\n\n        if (typeof onDoubleClick === 'function') {\n            onDoubleClick(event);\n        }\n    };\n\n    const theme = useTheme();\n\n    let maxStackSizeFactor = 1;\n\n    icons.forEach((icon) => {\n        const stackSizeFactor = getStackSizeFactor(icon);\n\n        if (stackSizeFactor && stackSizeFactor > maxStackSizeFactor) {\n            maxStackSizeFactor = stackSizeFactor;\n        }\n    });\n\n    const shouldUseStackedIcon = icons.length > 1;\n\n    const wrapperClasses = clsx(\n        'beta-chayns-icon',\n        shouldUseStackedIcon ? 'fa-stack' : '',\n        className,\n    );\n\n    return (\n        <StyledIconWrapper\n            className={wrapperClasses}\n            $isDisabled={isDisabled}\n            onClick={typeof onClick === 'function' ? handleClick : undefined}\n            $isOnClick={typeof onClick === 'function'}\n            onDoubleClick={typeof onDoubleClick === 'function' ? handleDoubleClick : undefined}\n            onMouseDown={onMouseDown}\n            $size={size}\n        >\n            {icons.map((icon) => {\n                const stackSizeFactor = getStackSizeFactor(icon);\n\n                // const isIconStyleGiven =\n                //     /fa[srltd]|fa-(?:regular|solid|thin|light|duotone|sharp)/.test(icon);\n                //\n                // const iconStyle = isIconStyleGiven\n                //     ? undefined\n                //     : (theme?.iconStyle as string) ?? 'fa-regular';\n\n                const iconClasses = clsx(icon, {\n                    'fa-stack-1x': shouldUseStackedIcon && stackSizeFactor === undefined,\n                });\n\n                return (\n                    <StyledIcon\n                        className={iconClasses}\n                        $color={icon.includes('fa-inverse') ? 'white' : color}\n                        $fontSize={((stackSizeFactor || 1) / maxStackSizeFactor) * size}\n                        $isStacked={shouldUseStackedIcon}\n                        key={icon}\n                        $size={size}\n                    />\n                );\n            })}\n        </StyledIconWrapper>\n    );\n};\n\nIcon.displayName = 'Icon';\n\nexport default Icon;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Icon.js","names":["_clsx","_interopRequireDefault","require","_react","_icon","_Icon","_styledComponents","e","__esModule","default","Icon","className","color","icons","isDisabled","onClick","onDoubleClick","onMouseDown","tabIndex","size","shouldStopPropagation","theme","useTheme","handleClick","event","stopPropagation","handleDoubleClick","maxStackSizeFactor","forEach","icon","stackSizeFactor","getStackSizeFactor","shouldUseStackedIcon","length","wrapperClasses","clsx","createElement","StyledIconWrapper","$isDisabled","undefined","$isOnClick","$size","map","iconStyle","themedIcon","replace","iconClasses","StyledIcon","$color","includes","$fontSize","$isStacked","key","displayName","_default","exports"],"sources":["../../../../src/components/icon/Icon.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { FC, MouseEventHandler } from 'react';\nimport { getStackSizeFactor } from '../../utils/icon';\nimport { StyledIcon, StyledIconWrapper } from './Icon.styles';\nimport { useTheme } from 'styled-components';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport type IconProps = {\n    /**\n     * Additional class name for the icon wrapper element.\n     * @description\n     * This class name is applied to the wrapper element that contains the icon. It can be used to\n     * style the icon wrapper element.\n     * @example\n     * <Icon className=\"my-custom-class\" icons={['fa-user']} />\n     * @optional\n     */\n    className?: string;\n    /**\n     * The color of the icon.\n     * @description\n     * This property can be used to set the color of the icon. The color is only used for icons that\n     * don't have a predefined color (e.g., 'fa-inverse' icons will always be white). If no color is\n     * specified, the icon color of the theme or the text color will be used.\n     * @example\n     * <Icon color=\"red\" icons={['fa-user']} />\n     * @optional\n     */\n    color?: string;\n    /**\n     * The icon(s) to be displayed.\n     * @description\n     * This property can be used to set the icon(s) to be displayed. The icon(s) must be specified as\n     * an array of strings. Each string must be a valid icon name.\n     * @example\n     * <Icon icons={['fa-user']} />\n     * <Icon icons={['fa fa-circle fa-stack-2x', 'fa fa-french-fries fa-inverse']} />\n     */\n    icons: string[];\n    /**\n     * Whether the icon should be disabled.\n     * @description\n     * This property can be used to disable the icon. When the icon is disabled, it will not be\n     * clickable, and it will not emit any events.\n     * @example\n     * <Icon icons={['fa-user']} isDisabled />\n     * @optional\n     */\n    isDisabled?: boolean;\n    /**\n     * Function to be executed when the icon is clicked.\n     * @description\n     * This function is executed when the icon is clicked. It can be used to handle the click event.\n     * @example\n     * <Icon icons={['fa-user']} onClick={() => console.log('Icon clicked')} />\n     * @optional\n     */\n    onClick?: MouseEventHandler<HTMLSpanElement>;\n    /**\n     * Function to be executed when the icon is double-clicked.\n     * @description\n     * This function is executed when the icon is double-clicked. It can be used to handle the\n     * double-click event.\n     * @example\n     * <Icon icons={['fa-user']} onDoubleClick={() => console.log('Icon double-clicked')} />\n     * @optional\n     */\n    onDoubleClick?: MouseEventHandler<HTMLSpanElement>;\n    /**\n     * Function to be executed when the icon is pressed.\n     * @description\n     * This function is executed when the icon is pressed. It can be used to handle the mouse down event.\n     * @example\n     * <Icon icons={['fa-user']} onMouseDown={() => console.log('Icon pressed')} />\n     * @optional\n     */\n    onMouseDown?: MouseEventHandler<HTMLSpanElement>;\n    /**\n     * The size of the icon.\n     * @description\n     * This property can be used to set the size of the icon. The size must be specified as a number\n     * in pixels.\n     * @default 15\n     * @example\n     * <Icon icons={['fa-user']} size={20} />\n     * @optional\n     */\n    size?: number;\n    /**\n     * Stops event propagation on click.\n     * @description\n     * This property can be used to prevent the icon from propagating the click event to its parent\n     * elements.\n     * @example\n     * <Icon icons={['fa-user']} shouldStopPropagation />\n     * @optional\n     */\n    shouldStopPropagation?: boolean;\n    /**\n     * Optional tab index for the icon.\n     */\n    tabIndex?: number;\n};\n\nconst Icon: FC<IconProps> = ({\n    className,\n    color,\n    icons,\n    isDisabled,\n    onClick,\n    onDoubleClick,\n    onMouseDown,\n    tabIndex,\n    size = 15,\n    shouldStopPropagation,\n}) => {\n    const theme = useTheme() as Theme;\n\n    const handleClick: MouseEventHandler<HTMLSpanElement> = (event) => {\n        if (shouldStopPropagation) {\n            event.stopPropagation();\n        }\n\n        if (typeof onClick === 'function') {\n            onClick(event);\n        }\n    };\n\n    const handleDoubleClick: MouseEventHandler<HTMLSpanElement> = (event) => {\n        if (shouldStopPropagation) {\n            event.stopPropagation();\n        }\n\n        if (typeof onDoubleClick === 'function') {\n            onDoubleClick(event);\n        }\n    };\n\n    let maxStackSizeFactor = 1;\n\n    icons.forEach((icon) => {\n        const stackSizeFactor = getStackSizeFactor(icon);\n\n        if (stackSizeFactor && stackSizeFactor > maxStackSizeFactor) {\n            maxStackSizeFactor = stackSizeFactor;\n        }\n    });\n\n    const shouldUseStackedIcon = icons.length > 1;\n\n    const wrapperClasses = clsx(\n        'beta-chayns-icon',\n        shouldUseStackedIcon ? 'fa-stack' : '',\n        className,\n    );\n\n    return (\n        <StyledIconWrapper\n            tabIndex={tabIndex}\n            className={wrapperClasses}\n            $isDisabled={isDisabled}\n            onClick={typeof onClick === 'function' && !isDisabled ? handleClick : undefined}\n            $isOnClick={typeof onClick === 'function' && !isDisabled}\n            onDoubleClick={\n                typeof onDoubleClick === 'function' && !isDisabled ? handleDoubleClick : undefined\n            }\n            onMouseDown={typeof onMouseDown === 'function' && !isDisabled ? onMouseDown : undefined}\n            $size={size}\n        >\n            {icons.map((icon) => {\n                const stackSizeFactor = getStackSizeFactor(icon);\n\n                const iconStyle = `${(theme?.iconStyle as string) ?? 'fa-regular'} `;\n                const themedIcon = icon?.replace(/^fa\\s/, iconStyle);\n\n                const iconClasses = clsx(themedIcon, {\n                    'fa-stack-1x': shouldUseStackedIcon && stackSizeFactor === undefined,\n                });\n\n                return (\n                    <StyledIcon\n                        className={iconClasses}\n                        $color={icon.includes('fa-inverse') ? 'white' : color}\n                        $fontSize={((stackSizeFactor || 1) / maxStackSizeFactor) * size}\n                        $isStacked={shouldUseStackedIcon}\n                        key={icon}\n                        $size={size}\n                    />\n                );\n            })}\n        </StyledIconWrapper>\n    );\n};\n\nIcon.displayName = 'Icon';\n\nexport default Icon;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/icon/Icon.styles.js

@@ -3,10 +3,9 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.StyledIconWrapper = exports.StyledIcon = void 0;
+exports.StyledUnicodeIcon = exports.StyledIconWrapper = exports.StyledIcon = 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 StyledIconWrapper = exports.StyledIconWrapper = _styledComponents.default.span`
     align-items: center;
     cursor: ${({
@@ -40,7 +39,7 @@ const StyledIcon = exports.StyledIcon = _styledComponents.default.i`
     color: ${({
   $color,
   theme
-}) => $color || theme.headline};
+}) => $color || theme.iconColor || theme.text};
     display: ${({
   $isStacked
 }) => $isStacked ? undefined : 'inline-flex'};
@@ -56,4 +55,18 @@ const StyledIcon = exports.StyledIcon = _styledComponents.default.i`
             transform: translateY(-50%);
         `}
 `;
+const StyledUnicodeIcon = exports.StyledUnicodeIcon = _styledComponents.default.i`
+    align-items: center;
+    justify-content: center;
+    display: flex;
+    color: ${({
+  theme
+}) => theme.iconColor || theme.headline};
+
+    &:before {
+        content: ${({
+  $icon
+}) => `"\\${$icon}"`};
+    }
+`;
 //# sourceMappingURL=Icon.styles.js.map

package/lib/cjs/components/icon/Icon.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.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","StyledIconWrapper","exports","styled","span","$isDisabled","$isOnClick","$size","StyledIcon","$color","theme","headline","$isStacked","undefined","$fontSize","css"],"sources":["../../../../src/components/icon/Icon.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledIconWrapperProps = {\n    $isDisabled?: boolean;\n    $isOnClick: boolean;\n    $size: number;\n};\n\nexport const StyledIconWrapper = styled.span<StyledIconWrapperProps>`\n    align-items: center;\n    cursor: ${({ $isDisabled, $isOnClick }) =>\n        $isOnClick && !$isDisabled ? 'pointer' : 'inherit'};\n    display: inline-flex;\n    min-height: ${({ $size }) => `${$size}px`};\n    justify-content: center;\n    opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n    position: relative;\n    transition: opacity 0.3s ease;\n    min-width: ${({ $size }) => `${$size}px`};\n\n    // To insure that stacked icons have the same size as normal icons.\n    &&.fa-stack {\n        height: fit-content;\n        width: fit-content;\n        line-height: ${({ $size }) => $size}px;\n    }\n`;\n\ntype StyledIconProps = WithTheme<{\n    $fontSize: number;\n    $isStacked?: boolean;\n    $color?: string;\n    $size: number;\n}>;\n\nexport const StyledIcon = styled.i<StyledIconProps>`\n    color: ${({ $color, theme }: StyledIconProps) => $color || theme.headline};\n    display: ${({ $isStacked }) => ($isStacked ? undefined : 'inline-flex')};\n    font-size: ${({ $fontSize }) => `${$fontSize}px`};\n\n    ${({ $fontSize, $size }) =>\n        $fontSize !== $size &&\n        css`\n            top: 50%;\n            transform: translateY(-50%);\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;AASzC,MAAMW,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAGE,yBAAM,CAACC,IAA4B;AACpE;AACA,cAAc,CAAC;EAAEC,WAAW;EAAEC;AAAW,CAAC,KAClCA,UAAU,IAAI,CAACD,WAAW,GAAG,SAAS,GAAG,SAAS;AAC1D;AACA,kBAAkB,CAAC;EAAEE;AAAM,CAAC,KAAK,GAAGA,KAAK,IAAI;AAC7C;AACA,eAAe,CAAC;EAAEF;AAAY,CAAC,KAAMA,WAAW,GAAG,GAAG,GAAG,CAAE;AAC3D;AACA;AACA,iBAAiB,CAAC;EAAEE;AAAM,CAAC,KAAK,GAAGA,KAAK,IAAI;AAC5C;AACA;AACA;AACA;AACA;AACA,uBAAuB,CAAC;EAAEA;AAAM,CAAC,KAAKA,KAAK;AAC3C;AACA,CAAC;AASM,MAAMC,UAAU,GAAAN,OAAA,CAAAM,UAAA,GAAGL,yBAAM,CAACJ,CAAkB;AACnD,aAAa,CAAC;EAAEU,MAAM;EAAEC;AAAuB,CAAC,KAAKD,MAAM,IAAIC,KAAK,CAACC,QAAQ;AAC7E,eAAe,CAAC;EAAEC;AAAW,CAAC,KAAMA,UAAU,GAAGC,SAAS,GAAG,aAAc;AAC3E,iBAAiB,CAAC;EAAEC;AAAU,CAAC,KAAK,GAAGA,SAAS,IAAI;AACpD;AACA,MAAM,CAAC;EAAEA,SAAS;EAAEP;AAAM,CAAC,KACnBO,SAAS,KAAKP,KAAK,IACnB,IAAAQ,qBAAG;AACX;AACA;AACA,SAAS;AACT,CAAC","ignoreList":[]}
+{"version":3,"file":"Icon.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","StyledIconWrapper","exports","styled","span","$isDisabled","$isOnClick","$size","StyledIcon","$color","theme","iconColor","text","$isStacked","undefined","$fontSize","css","StyledUnicodeIcon","headline","$icon"],"sources":["../../../../src/components/icon/Icon.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { motion } from 'motion/react';\n\ntype StyledIconWrapperProps = {\n    $isDisabled?: boolean;\n    $isOnClick: boolean;\n    $size: number;\n};\n\nexport const StyledIconWrapper = styled.span<StyledIconWrapperProps>`\n    align-items: center;\n    cursor: ${({ $isDisabled, $isOnClick }) =>\n        $isOnClick && !$isDisabled ? 'pointer' : 'inherit'};\n    display: inline-flex;\n    min-height: ${({ $size }) => `${$size}px`};\n    justify-content: center;\n    opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n    position: relative;\n    transition: opacity 0.3s ease;\n    min-width: ${({ $size }) => `${$size}px`};\n\n    // To insure that stacked icons have the same size as normal icons.\n    &&.fa-stack {\n        height: fit-content;\n        width: fit-content;\n        line-height: ${({ $size }) => $size}px;\n    }\n`;\n\ntype StyledIconProps = WithTheme<{\n    $fontSize: number;\n    $isStacked?: boolean;\n    $color?: string;\n    $size: number;\n}>;\n\nexport const StyledIcon = styled.i<StyledIconProps>`\n    color: ${({ $color, theme }: StyledIconProps) => $color || theme.iconColor || theme.text};\n    display: ${({ $isStacked }) => ($isStacked ? undefined : 'inline-flex')};\n    font-size: ${({ $fontSize }) => `${$fontSize}px`};\n\n    ${({ $fontSize, $size }) =>\n        $fontSize !== $size &&\n        css`\n            top: 50%;\n            transform: translateY(-50%);\n        `}\n`;\n\ntype StyledUnicodeIconProps = WithTheme<{ $icon: string }>;\n\nexport const StyledUnicodeIcon = styled.i<StyledUnicodeIconProps>`\n    align-items: center;\n    justify-content: center;\n    display: flex;\n    color: ${({ theme }: StyledUnicodeIconProps) => theme.iconColor || theme.headline};\n\n    &:before {\n        content: ${({ $icon }) => `\"\\\\${$icon}\"`};\n    }\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,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;AAUzC,MAAMkB,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAGE,yBAAM,CAACC,IAA4B;AACpE;AACA,cAAc,CAAC;EAAEC,WAAW;EAAEC;AAAW,CAAC,KAClCA,UAAU,IAAI,CAACD,WAAW,GAAG,SAAS,GAAG,SAAS;AAC1D;AACA,kBAAkB,CAAC;EAAEE;AAAM,CAAC,KAAK,GAAGA,KAAK,IAAI;AAC7C;AACA,eAAe,CAAC;EAAEF;AAAY,CAAC,KAAMA,WAAW,GAAG,GAAG,GAAG,CAAE;AAC3D;AACA;AACA,iBAAiB,CAAC;EAAEE;AAAM,CAAC,KAAK,GAAGA,KAAK,IAAI;AAC5C;AACA;AACA;AACA;AACA;AACA,uBAAuB,CAAC;EAAEA;AAAM,CAAC,KAAKA,KAAK;AAC3C;AACA,CAAC;AASM,MAAMC,UAAU,GAAAN,OAAA,CAAAM,UAAA,GAAGL,yBAAM,CAACd,CAAkB;AACnD,aAAa,CAAC;EAAEoB,MAAM;EAAEC;AAAuB,CAAC,KAAKD,MAAM,IAAIC,KAAK,CAACC,SAAS,IAAID,KAAK,CAACE,IAAI;AAC5F,eAAe,CAAC;EAAEC;AAAW,CAAC,KAAMA,UAAU,GAAGC,SAAS,GAAG,aAAc;AAC3E,iBAAiB,CAAC;EAAEC;AAAU,CAAC,KAAK,GAAGA,SAAS,IAAI;AACpD;AACA,MAAM,CAAC;EAAEA,SAAS;EAAER;AAAM,CAAC,KACnBQ,SAAS,KAAKR,KAAK,IACnB,IAAAS,qBAAG;AACX;AACA;AACA,SAAS;AACT,CAAC;AAIM,MAAMC,iBAAiB,GAAAf,OAAA,CAAAe,iBAAA,GAAGd,yBAAM,CAACd,CAAyB;AACjE;AACA;AACA;AACA,aAAa,CAAC;EAAEqB;AAA8B,CAAC,KAAKA,KAAK,CAACC,SAAS,IAAID,KAAK,CAACQ,QAAQ;AACrF;AACA;AACA,mBAAmB,CAAC;EAAEC;AAAM,CAAC,KAAK,MAAMA,KAAK,GAAG;AAChD;AACA,CAAC","ignoreList":[]}