@windstream/react-shared-components 0.1.94 → 0.1.96

package/src/utils/speed-card-bg.test.ts

@@ -1,46 +1,46 @@
-import SpeedCardBg, { SpeedCardBg as namedExport } from "./speed-card-bg";
-
-describe("SpeedCardBg", () => {
-  it("returns a valid SVG string", () => {
-    const svg = SpeedCardBg();
-    expect(svg).toContain("<svg");
-    expect(svg).toContain("</svg>");
-    expect(svg).toContain('xmlns="http://www.w3.org/2000/svg"');
-  });
-
-  it("uses default color #24A76A when no argument provided", () => {
-    const svg = SpeedCardBg();
-    expect(svg).toContain('fill="#24A76A"');
-    expect(svg).not.toContain("${color}");
-  });
-
-  it("applies custom color to fill attributes", () => {
-    const svg = SpeedCardBg("#FF0000");
-    expect(svg).toContain('fill="#FF0000"');
-    expect(svg).not.toContain('fill="#24A76A"');
-  });
-
-  it("has correct SVG dimensions", () => {
-    const svg = SpeedCardBg();
-    expect(svg).toContain('width="684"');
-    expect(svg).toContain('height="107"');
-    expect(svg).toContain('viewBox="0 0 684 107"');
-  });
-
-  it("contains two path elements for the pinwheel", () => {
-    const svg = SpeedCardBg();
-    const pathMatches = svg.match(/<path /g);
-    expect(pathMatches).toHaveLength(2);
-  });
-
-  it("fills both paths with the provided color", () => {
-    const color = "#ABCDEF";
-    const svg = SpeedCardBg(color);
-    const fillMatches = svg.match(new RegExp(`fill="${color}"`, "g"));
-    expect(fillMatches).toHaveLength(2);
-  });
-
-  it("exports the same function as both default and named", () => {
-    expect(namedExport).toBe(SpeedCardBg);
-  });
-});
+import SpeedCardBg, { SpeedCardBg as namedExport } from "./speed-card-bg";
+
+describe("SpeedCardBg", () => {
+  it("returns a valid SVG string", () => {
+    const svg = SpeedCardBg();
+    expect(svg).toContain("<svg");
+    expect(svg).toContain("</svg>");
+    expect(svg).toContain('xmlns="http://www.w3.org/2000/svg"');
+  });
+
+  it("uses default color #24A76A when no argument provided", () => {
+    const svg = SpeedCardBg();
+    expect(svg).toContain('fill="#24A76A"');
+    expect(svg).not.toContain("${color}");
+  });
+
+  it("applies custom color to fill attributes", () => {
+    const svg = SpeedCardBg("#FF0000");
+    expect(svg).toContain('fill="#FF0000"');
+    expect(svg).not.toContain('fill="#24A76A"');
+  });
+
+  it("has correct SVG dimensions", () => {
+    const svg = SpeedCardBg();
+    expect(svg).toContain('width="684"');
+    expect(svg).toContain('height="107"');
+    expect(svg).toContain('viewBox="0 0 684 107"');
+  });
+
+  it("contains two path elements for the pinwheel", () => {
+    const svg = SpeedCardBg();
+    const pathMatches = svg.match(/<path /g);
+    expect(pathMatches).toHaveLength(2);
+  });
+
+  it("fills both paths with the provided color", () => {
+    const color = "#ABCDEF";
+    const svg = SpeedCardBg(color);
+    const fillMatches = svg.match(new RegExp(`fill="${color}"`, "g"));
+    expect(fillMatches).toHaveLength(2);
+  });
+
+  it("exports the same function as both default and named", () => {
+    expect(namedExport).toBe(SpeedCardBg);
+  });
+});

package/src/utils/speed-card-bg.ts

@@ -1,24 +1,24 @@
-/**
- * Returns an inline SVG string for the SpeedCard pinwheel decorative
- * background. The two paths are filled with the provided color so callers
- * can theme the background dynamically (used by SimpleCard when
- * `showBackgroundImage` is enabled and a `pinwheelColor` is provided).
- *
- * Output is intended to be embedded as a `data:image/svg+xml;utf8,...`
- * `background-image`. Encode the result with `encodeURIComponent`.
- */
-export const SpeedCardBg = (color: string = "#24A76A"): string => {
-  return `<svg xmlns="http://www.w3.org/2000/svg" width="684" height="107" viewBox="0 0 684 107" fill="none">
-    <g clip-path="url(#clip0_12352_9042)">
-      <path d="M154.09 -70.5605C173.769 -7.58032 204.79 24.8889 328.202 55.2823C444.619 83.9133 629.479 141.332 667.653 80.7015C691.679 45.2165 678.322 -5.62201 670.537 -46.3554C664.452 -73.1846 658.327 -97.1939 652.913 -123.475C651.135 -132.091 638.766 -131.974 637.067 -123.318C628.136 -77.6888 612.526 -44.9062 577.593 -22.4637C517.962 20.1889 377.954 -6.48361 303.148 -38.287C223.245 -70.7171 200.918 -132.366 195.425 -199.341C193.37 -235.257 198.467 -269.841 208.07 -299.569C210.915 -308.303 199.218 -314.178 193.844 -306.697C151.324 -247.751 137.69 -140.395 154.129 -70.5213" fill="${color}" />
-      <path d="M167.605 -417.382C104.062 -397.877 71.302 -367.131 40.6368 -244.813C11.7499 -129.428 -46.182 53.7941 14.9903 91.6292C50.7927 115.443 102.086 102.204 143.183 94.4883C170.253 88.4567 194.476 82.3858 220.992 77.02C229.686 75.2574 229.568 62.9983 220.834 61.3141C174.797 52.4624 141.721 36.9915 119.078 2.36813C76.0441 -56.7345 102.955 -195.502 135.043 -269.645C167.763 -348.84 229.963 -370.969 297.537 -376.414C333.774 -378.45 368.667 -373.398 398.661 -363.88C407.473 -361.06 413.401 -372.654 405.853 -377.98C346.38 -420.124 238.064 -433.636 167.565 -417.343" fill="${color}" />
-    </g>
-    <defs>
-      <clipPath id="clip0_12352_9042">
-        <rect width="684" height="107" fill="white" />
-      </clipPath>
-    </defs>
-  </svg>`;
-};
-
-export default SpeedCardBg;
+/**
+ * Returns an inline SVG string for the SpeedCard pinwheel decorative
+ * background. The two paths are filled with the provided color so callers
+ * can theme the background dynamically (used by SimpleCard when
+ * `showBackgroundImage` is enabled and a `pinwheelColor` is provided).
+ *
+ * Output is intended to be embedded as a `data:image/svg+xml;utf8,...`
+ * `background-image`. Encode the result with `encodeURIComponent`.
+ */
+export const SpeedCardBg = (color: string = "#24A76A"): string => {
+  return `<svg xmlns="http://www.w3.org/2000/svg" width="684" height="107" viewBox="0 0 684 107" fill="none">
+    <g clip-path="url(#clip0_12352_9042)">
+      <path d="M154.09 -70.5605C173.769 -7.58032 204.79 24.8889 328.202 55.2823C444.619 83.9133 629.479 141.332 667.653 80.7015C691.679 45.2165 678.322 -5.62201 670.537 -46.3554C664.452 -73.1846 658.327 -97.1939 652.913 -123.475C651.135 -132.091 638.766 -131.974 637.067 -123.318C628.136 -77.6888 612.526 -44.9062 577.593 -22.4637C517.962 20.1889 377.954 -6.48361 303.148 -38.287C223.245 -70.7171 200.918 -132.366 195.425 -199.341C193.37 -235.257 198.467 -269.841 208.07 -299.569C210.915 -308.303 199.218 -314.178 193.844 -306.697C151.324 -247.751 137.69 -140.395 154.129 -70.5213" fill="${color}" />
+      <path d="M167.605 -417.382C104.062 -397.877 71.302 -367.131 40.6368 -244.813C11.7499 -129.428 -46.182 53.7941 14.9903 91.6292C50.7927 115.443 102.086 102.204 143.183 94.4883C170.253 88.4567 194.476 82.3858 220.992 77.02C229.686 75.2574 229.568 62.9983 220.834 61.3141C174.797 52.4624 141.721 36.9915 119.078 2.36813C76.0441 -56.7345 102.955 -195.502 135.043 -269.645C167.763 -348.84 229.963 -370.969 297.537 -376.414C333.774 -378.45 368.667 -373.398 398.661 -363.88C407.473 -361.06 413.401 -372.654 405.853 -377.98C346.38 -420.124 238.064 -433.636 167.565 -417.343" fill="${color}" />
+    </g>
+    <defs>
+      <clipPath id="clip0_12352_9042">
+        <rect width="684" height="107" fill="white" />
+      </clipPath>
+    </defs>
+  </svg>`;
+};
+
+export default SpeedCardBg;