{"version":3,"sources":["../src/type.ts","../src/loader/color-ring.tsx"],"names":["DEFAULT_WAI_ARIA_ATTRIBUTE","ColorRing","visible","width","height","colors","wrapperClass","wrapperStyle","ariaLabel","jsxs","jsx"],"mappings":"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","file":"color-ring.mjs","sourcesContent":["import { CSSProperties } from 'react'\n\nexport const DEFAULT_COLOR = '#4fa94d'\n\nexport const DEFAULT_WAI_ARIA_ATTRIBUTE = {\n  'aria-busy': true,\n  role: 'progressbar',\n}\n\n// Reuse React's CSSProperties for consistent style typing across components\nexport type Style = CSSProperties\n\n// PrimaryProps includes common props shared by experimental components\nexport interface PrimaryProps {\n  height?: string | number\n  width?: string | number\n  color?: string\n  ariaLabel?: string\n  wrapperStyle?: CSSProperties\n  wrapperClass?: string\n  visible?: boolean\n}\n\n\n","import { ReactElement, FunctionComponent, CSSProperties } from 'react'\nimport { DEFAULT_WAI_ARIA_ATTRIBUTE } from '../type'\n\n/**\n * Props for the ColorRing loader component.\n * \n * The ColorRing loader displays a circular ring with animated color segments.\n * \n * @interface ColorRingProps\n */\ninterface ColorRingProps {\n  /** Height of the SVG (number interpreted as px). */\n  height?: string | number\n  /** Width of the SVG (number interpreted as px). */\n  width?: string | number\n  /** Primary color applied to the loader. */\n  color?: string\n  /** Accessible label announced to screen readers. */\n  ariaLabel?: string\n  /** Inline style object applied to the wrapper element. */\n  wrapperStyle?: CSSProperties\n  /** CSS class applied to the wrapper for custom styling. */\n  wrapperClass?: string\n  /** When false, the loader is not rendered. Defaults to true. */\n  visible?: boolean\n  /** \n   * Provide multiple colors to render a gradient instead of a solid color.\n   * When 2 or more colors are supplied a gradient will be applied to the loader.\n   */\n  colors?: string[]\n  /** Type of gradient (linear or radial). Defaults to linear. */\n  gradientType?: 'linear' | 'radial'\n  /** Angle (in degrees) applied via rotate() transform for linear gradients. */\n  gradientAngle?: number\n}\n\nexport const ColorRing: FunctionComponent<ColorRingProps> = ({\n  visible = true,\n  width = '80',\n  height = '80',\n  colors = ['#e15b64', '#f47e60', '#f8b26a', '#abbd81', '#849b87'],\n  wrapperClass = '',\n  wrapperStyle = {},\n  ariaLabel = 'color-ring-loading',\n}): ReactElement | null => {\n  return !visible ? null : (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      xmlnsXlink=\"http://www.w3.org/1999/xlink\"\n      width={width}\n      height={height}\n      viewBox=\"0 0 100 100\"\n      preserveAspectRatio=\"xMidYMid\"\n      className={wrapperClass}\n      style={wrapperStyle}\n      aria-label={ariaLabel}\n      data-testid=\"color-ring-svg\"\n      {...DEFAULT_WAI_ARIA_ATTRIBUTE}\n    >\n      <defs>\n        <mask id=\"ldio-4offds5dlws-mask\">\n          <circle\n            cx=\"50\"\n            cy=\"50\"\n            r=\"26\"\n            stroke=\"#fff\"\n            strokeLinecap=\"round\"\n            strokeDasharray=\"122.52211349000194 40.840704496667314\"\n            strokeWidth=\"9\"\n            transform=\"rotate(198.018 50 50)\"\n          >\n            <animateTransform\n              attributeName=\"transform\"\n              type=\"rotate\"\n              values=\"0 50 50;360 50 50\"\n              keyTimes=\"0;1\"\n              dur=\"1s\"\n              repeatCount=\"indefinite\"\n            ></animateTransform>\n          </circle>\n        </mask>\n      </defs>\n      <g mask=\"url(#ldio-4offds5dlws-mask)\">\n        <rect x=\"14.5\" y=\"0\" width=\"15\" height=\"100\" fill={colors[0]}>\n          <animate\n            attributeName=\"fill\"\n            values={colors.join(';').toString()}\n            keyTimes=\"0;0.25;0.5;0.75;1\"\n            dur=\"1s\"\n            repeatCount=\"indefinite\"\n            begin=\"-0.8s\"\n          ></animate>\n        </rect>\n        <rect x=\"28.5\" y=\"0\" width=\"15\" height=\"100\" fill={colors[1]}>\n          <animate\n            attributeName=\"fill\"\n            values={colors.join(';').toString()}\n            keyTimes=\"0;0.25;0.5;0.75;1\"\n            dur=\"1s\"\n            repeatCount=\"indefinite\"\n            begin=\"-0.6s\"\n          ></animate>\n        </rect>\n        <rect x=\"42.5\" y=\"0\" width=\"15\" height=\"100\" fill={colors[2]}>\n          <animate\n            attributeName=\"fill\"\n            values={colors.join(';').toString()}\n            keyTimes=\"0;0.25;0.5;0.75;1\"\n            dur=\"1s\"\n            repeatCount=\"indefinite\"\n            begin=\"-0.4s\"\n          ></animate>\n        </rect>\n        <rect x=\"56.5\" y=\"0\" width=\"15\" height=\"100\" fill={colors[3]}>\n          <animate\n            attributeName=\"fill\"\n            values={colors.join(';').toString()}\n            keyTimes=\"0;0.25;0.5;0.75;1\"\n            dur=\"1s\"\n            repeatCount=\"indefinite\"\n            begin=\"-0.2s\"\n          ></animate>\n        </rect>\n        <rect x=\"70.5\" y=\"0\" width=\"15\" height=\"100\" fill={colors[4]}>\n          <animate\n            attributeName=\"fill\"\n            values={colors.join(';').toString()}\n            keyTimes=\"0;0.25;0.5;0.75;1\"\n            dur=\"1s\"\n            repeatCount=\"indefinite\"\n            begin=\"0s\"\n          ></animate>\n        </rect>\n      </g>\n    </svg>\n  )\n}\n"]}