{"version":3,"file":"chunk-SkeletonLoader.CBVjioc-.js","sources":["../../src/components/SkeletonLoaders/SkeletonLoader.tsx"],"sourcesContent":["import { theme } from '#app/theme/theme.js';\nimport { type SkeletonLoaderProps } from './types.js';\nimport { forwardRef, type Ref, useMemo } from 'react';\nimport { styled } from 'styled-components';\n\nconst uid = (): string => Math.random().toString(36).slice(6);\n\nconst SkeletonLoaderWrapper = styled.div`\n  overflow: hidden;\n  width: 100%;\n`;\n\nconst DefaultItemWrapper = styled.div`\n  margin: 24px 0px;\n  overflow: hidden;\n`;\n\nexport const SkeletonLoader = forwardRef(\n  (\n    {\n      animate = true,\n      baseUrl = '',\n      children,\n      colorBase = theme.colorsV2.gray30,\n      delayIncrement = 0.2,\n      gradientColor1 = theme.colorsV2.gray50,\n      gradientColor2 = theme.colorsV2.gray70,\n      gradientColorOpacity1 = 0.8,\n      gradientColorOpacity2 = 0.8,\n      gradientRatio = 1.5,\n      interval = 0.25,\n      isLoading = false,\n      ItemWrapper = DefaultItemWrapper,\n      repeat = 1,\n      rtl = false,\n      speed = 2.8,\n      svgStyle = {},\n      title = 'Loading...',\n      uniqueKey,\n      ...props\n    }: SkeletonLoaderProps,\n    ref: Ref<HTMLDivElement>,\n  ) => {\n    const fixedId = uniqueKey ?? uid();\n    const svgRtlStyle = rtl ? { transform: 'scaleX(-1)' } : null;\n    const keyTimes = `0; ${interval}; 1`;\n    const dur = `${speed}s`;\n\n    const loaders = useMemo(\n      () =>\n        Array.from({ length: repeat }).map((_, index) => ({\n          ariaId: `${fixedId}-${index}-aria`,\n          clipId: `${fixedId}-${index}-diff`,\n          delay: 0 + index * delayIncrement,\n          gradientId: `${fixedId}-${index}-animated-diff`,\n          idx: `${fixedId}-${index}`,\n        })),\n      [delayIncrement, fixedId, repeat],\n    );\n\n    return (\n      <SkeletonLoaderWrapper ref={ref}>\n        {isLoading &&\n          loaders.map(({ clipId, delay, gradientId, idx }) => (\n            <ItemWrapper key={idx}>\n              <svg\n                aria-labelledby={`${idx}-aria`}\n                role=\"img\"\n                style={{ ...svgStyle, ...svgRtlStyle }}\n                {...props}\n              >\n                {title ? <title id={`${idx}-aria`}>{title}</title> : null}\n\n                <rect\n                  clipPath={`url(${baseUrl}#${clipId})`}\n                  height=\"100%\"\n                  role=\"presentation\"\n                  style={{ fill: colorBase }}\n                  width=\"100%\"\n                  x=\"0\"\n                  y=\"0\"\n                />\n\n                <rect\n                  clipPath={`url(${baseUrl}#${clipId})`}\n                  height=\"100%\"\n                  role=\"presentation\"\n                  style={{ fill: `url(${baseUrl}#${gradientId})` }}\n                  width=\"100%\"\n                  x=\"0\"\n                  y=\"0\"\n                />\n\n                <defs>\n                  <clipPath id={clipId}>{children}</clipPath>\n                  <linearGradient id={gradientId}>\n                    <stop\n                      offset=\"0%\"\n                      stopColor={gradientColor1}\n                      stopOpacity={gradientColorOpacity1}\n                    >\n                      {animate && (\n                        <animate\n                          attributeName=\"offset\"\n                          begin={delay}\n                          dur={dur}\n                          keyTimes={keyTimes}\n                          repeatCount=\"indefinite\"\n                          values={`${-gradientRatio}; ${-gradientRatio}; 1`}\n                        />\n                      )}\n                    </stop>\n\n                    <stop\n                      offset=\"50%\"\n                      stopColor={gradientColor2}\n                      stopOpacity={gradientColorOpacity2}\n                    >\n                      {animate && (\n                        <animate\n                          attributeName=\"offset\"\n                          begin={delay}\n                          dur={dur}\n                          keyTimes={keyTimes}\n                          repeatCount=\"indefinite\"\n                          values={`${-gradientRatio / 2}; ${\n                            -gradientRatio / 2\n                          }; ${1 + gradientRatio / 2}`}\n                        />\n                      )}\n                    </stop>\n\n                    <stop\n                      offset=\"100%\"\n                      stopColor={gradientColor1}\n                      stopOpacity={gradientColorOpacity1}\n                    >\n                      {animate && (\n                        <animate\n                          attributeName=\"offset\"\n                          begin={delay}\n                          dur={dur}\n                          keyTimes={keyTimes}\n                          repeatCount=\"indefinite\"\n                          values={`0; 0; ${1 + Number(gradientRatio)}`}\n                        />\n                      )}\n                    </stop>\n                  </linearGradient>\n                </defs>\n              </svg>\n            </ItemWrapper>\n          ))}\n      </SkeletonLoaderWrapper>\n    );\n  },\n);\n"],"names":["uid","Math","random","toString","slice","SkeletonLoaderWrapper","styled","div","withConfig","displayName","componentId","DefaultItemWrapper","SkeletonLoader","forwardRef","animate","baseUrl","children","colorBase","theme","colorsV2","gray30","delayIncrement","gradientColor1","gray50","gradientColor2","gray70","gradientColorOpacity1","gradientColorOpacity2","gradientRatio","interval","isLoading","ItemWrapper","repeat","rtl","speed","svgStyle","title","uniqueKey","props","ref","fixedId","svgRtlStyle","transform","keyTimes","dur","loaders","useMemo","Array","from","length","map","_","index","ariaId","clipId","delay","gradientId","idx","jsx","jsxs","fill","Number"],"mappings":"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"}