@apexcura/ui-components 0.0.14-Beta44 → 0.0.14-Beta46

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -379,7 +379,6 @@ var import_react11 = __toESM(require("react"));
379
379
  var ButtonElement = (props) => {
380
380
  const [svgContent, setSvgContent] = (0, import_react11.useState)(null);
381
381
  const [hoverColor, setHoverColor] = (0, import_react11.useState)(null);
382
- const [originalFillColors, setOriginalFillColors] = (0, import_react11.useState)([]);
383
382
  (0, import_react11.useEffect)(() => {
384
383
  if (props.icon) {
385
384
  fetch(props.icon).then((response) => response.text()).then((data) => {
@@ -387,28 +386,26 @@ var ButtonElement = (props) => {
387
386
  tempDiv.innerHTML = data;
388
387
  const svgElement = tempDiv.querySelector("svg");
389
388
  if (svgElement) {
390
- const textColorClass = props.className.match(/text-[\w-]+/g)?.[0];
391
- const hoverColorClass = props.className.match(/hover:text-[\w-]+/g)?.[0];
392
- if (textColorClass) {
393
- const tempSpan = document.createElement("span");
394
- tempSpan.className = textColorClass;
395
- document.body.appendChild(tempSpan);
396
- const computedColor = getComputedStyle(tempSpan).color;
397
- document.body.removeChild(tempSpan);
398
- const paths = svgElement.querySelectorAll("path");
399
- paths.forEach((path) => {
400
- const originalFill = path.getAttribute("fill");
401
- path.setAttribute("fill", computedColor);
402
- setOriginalFillColors((prev) => [...prev, originalFill || ""]);
403
- });
404
- }
405
- if (hoverColorClass) {
406
- const tempSpan = document.createElement("span");
407
- tempSpan.className = hoverColorClass.replace("hover:", "");
408
- document.body.appendChild(tempSpan);
409
- const computedHoverColor = getComputedStyle(tempSpan).color;
410
- document.body.removeChild(tempSpan);
411
- setHoverColor(computedHoverColor);
389
+ if (props.svgoverride) {
390
+ const textColorClass = props.className.match(/text-[\w-]+/g)?.[0];
391
+ const hoverColorClass = props.className.match(/hover:text-[\w-]+/g)?.[0];
392
+ if (textColorClass) {
393
+ const tempSpan = document.createElement("span");
394
+ tempSpan.className = textColorClass;
395
+ document.body.appendChild(tempSpan);
396
+ const computedColor = getComputedStyle(tempSpan).color;
397
+ document.body.removeChild(tempSpan);
398
+ const paths = svgElement.querySelectorAll("path");
399
+ paths.forEach((path) => path.setAttribute("fill", computedColor));
400
+ }
401
+ if (hoverColorClass) {
402
+ const tempSpan = document.createElement("span");
403
+ tempSpan.className = hoverColorClass.replace("hover:", "");
404
+ document.body.appendChild(tempSpan);
405
+ const computedHoverColor = getComputedStyle(tempSpan).color;
406
+ document.body.removeChild(tempSpan);
407
+ setHoverColor(computedHoverColor);
408
+ }
412
409
  }
413
410
  svgElement.setAttribute(
414
411
  "class",
@@ -418,36 +415,25 @@ var ButtonElement = (props) => {
418
415
  }
419
416
  }).catch((error) => console.error("Error fetching SVG:", error));
420
417
  }
421
- }, [props.icon, props.className]);
418
+ }, [props.icon, props.className, props.svgoverride]);
422
419
  const handleMouseEnter = () => {
423
- if (hoverColor && svgContent) {
424
- setSvgContent((prevSvgContent) => {
425
- if (!prevSvgContent) return null;
426
- const tempDiv = document.createElement("div");
427
- tempDiv.innerHTML = prevSvgContent;
428
- const svgElement = tempDiv.querySelector("svg");
429
- const paths = svgElement?.querySelectorAll("path");
430
- paths?.forEach((path, index) => {
431
- path.setAttribute("fill", hoverColor);
432
- });
433
- return tempDiv.innerHTML;
434
- });
420
+ if (props.svgoverride && hoverColor && svgContent) {
421
+ const tempDiv = document.createElement("div");
422
+ tempDiv.innerHTML = svgContent;
423
+ const svgElement = tempDiv.querySelector("svg");
424
+ const paths = svgElement?.querySelectorAll("path");
425
+ paths?.forEach((path) => path.setAttribute("fill", hoverColor));
426
+ setSvgContent(tempDiv.innerHTML);
435
427
  }
436
428
  };
437
429
  const handleMouseLeave = () => {
438
- if (svgContent) {
439
- setSvgContent((prevSvgContent) => {
440
- if (!prevSvgContent) return null;
441
- const tempDiv = document.createElement("div");
442
- tempDiv.innerHTML = prevSvgContent;
443
- const svgElement = tempDiv.querySelector("svg");
444
- const paths = svgElement?.querySelectorAll("path");
445
- paths?.forEach((path, index) => {
446
- const originalFill = originalFillColors[index];
447
- path.setAttribute("fill", originalFill);
448
- });
449
- return tempDiv.innerHTML;
450
- });
430
+ if (props.svgoverride && svgContent) {
431
+ const tempDiv = document.createElement("div");
432
+ tempDiv.innerHTML = svgContent;
433
+ const svgElement = tempDiv.querySelector("svg");
434
+ const paths = svgElement?.querySelectorAll("path");
435
+ paths?.forEach((path) => path.removeAttribute("fill"));
436
+ setSvgContent(tempDiv.innerHTML);
451
437
  }
452
438
  };
453
439
  return /* @__PURE__ */ import_react11.default.createElement(
package/dist/index.mjs CHANGED
@@ -320,7 +320,6 @@ import React11, { useEffect, useState as useState4 } from "react";
320
320
  var ButtonElement = (props) => {
321
321
  const [svgContent, setSvgContent] = useState4(null);
322
322
  const [hoverColor, setHoverColor] = useState4(null);
323
- const [originalFillColors, setOriginalFillColors] = useState4([]);
324
323
  useEffect(() => {
325
324
  if (props.icon) {
326
325
  fetch(props.icon).then((response) => response.text()).then((data) => {
@@ -328,28 +327,26 @@ var ButtonElement = (props) => {
328
327
  tempDiv.innerHTML = data;
329
328
  const svgElement = tempDiv.querySelector("svg");
330
329
  if (svgElement) {
331
- const textColorClass = props.className.match(/text-[\w-]+/g)?.[0];
332
- const hoverColorClass = props.className.match(/hover:text-[\w-]+/g)?.[0];
333
- if (textColorClass) {
334
- const tempSpan = document.createElement("span");
335
- tempSpan.className = textColorClass;
336
- document.body.appendChild(tempSpan);
337
- const computedColor = getComputedStyle(tempSpan).color;
338
- document.body.removeChild(tempSpan);
339
- const paths = svgElement.querySelectorAll("path");
340
- paths.forEach((path) => {
341
- const originalFill = path.getAttribute("fill");
342
- path.setAttribute("fill", computedColor);
343
- setOriginalFillColors((prev) => [...prev, originalFill || ""]);
344
- });
345
- }
346
- if (hoverColorClass) {
347
- const tempSpan = document.createElement("span");
348
- tempSpan.className = hoverColorClass.replace("hover:", "");
349
- document.body.appendChild(tempSpan);
350
- const computedHoverColor = getComputedStyle(tempSpan).color;
351
- document.body.removeChild(tempSpan);
352
- setHoverColor(computedHoverColor);
330
+ if (props.svgoverride) {
331
+ const textColorClass = props.className.match(/text-[\w-]+/g)?.[0];
332
+ const hoverColorClass = props.className.match(/hover:text-[\w-]+/g)?.[0];
333
+ if (textColorClass) {
334
+ const tempSpan = document.createElement("span");
335
+ tempSpan.className = textColorClass;
336
+ document.body.appendChild(tempSpan);
337
+ const computedColor = getComputedStyle(tempSpan).color;
338
+ document.body.removeChild(tempSpan);
339
+ const paths = svgElement.querySelectorAll("path");
340
+ paths.forEach((path) => path.setAttribute("fill", computedColor));
341
+ }
342
+ if (hoverColorClass) {
343
+ const tempSpan = document.createElement("span");
344
+ tempSpan.className = hoverColorClass.replace("hover:", "");
345
+ document.body.appendChild(tempSpan);
346
+ const computedHoverColor = getComputedStyle(tempSpan).color;
347
+ document.body.removeChild(tempSpan);
348
+ setHoverColor(computedHoverColor);
349
+ }
353
350
  }
354
351
  svgElement.setAttribute(
355
352
  "class",
@@ -359,36 +356,25 @@ var ButtonElement = (props) => {
359
356
  }
360
357
  }).catch((error) => console.error("Error fetching SVG:", error));
361
358
  }
362
- }, [props.icon, props.className]);
359
+ }, [props.icon, props.className, props.svgoverride]);
363
360
  const handleMouseEnter = () => {
364
- if (hoverColor && svgContent) {
365
- setSvgContent((prevSvgContent) => {
366
- if (!prevSvgContent) return null;
367
- const tempDiv = document.createElement("div");
368
- tempDiv.innerHTML = prevSvgContent;
369
- const svgElement = tempDiv.querySelector("svg");
370
- const paths = svgElement?.querySelectorAll("path");
371
- paths?.forEach((path, index) => {
372
- path.setAttribute("fill", hoverColor);
373
- });
374
- return tempDiv.innerHTML;
375
- });
361
+ if (props.svgoverride && hoverColor && svgContent) {
362
+ const tempDiv = document.createElement("div");
363
+ tempDiv.innerHTML = svgContent;
364
+ const svgElement = tempDiv.querySelector("svg");
365
+ const paths = svgElement?.querySelectorAll("path");
366
+ paths?.forEach((path) => path.setAttribute("fill", hoverColor));
367
+ setSvgContent(tempDiv.innerHTML);
376
368
  }
377
369
  };
378
370
  const handleMouseLeave = () => {
379
- if (svgContent) {
380
- setSvgContent((prevSvgContent) => {
381
- if (!prevSvgContent) return null;
382
- const tempDiv = document.createElement("div");
383
- tempDiv.innerHTML = prevSvgContent;
384
- const svgElement = tempDiv.querySelector("svg");
385
- const paths = svgElement?.querySelectorAll("path");
386
- paths?.forEach((path, index) => {
387
- const originalFill = originalFillColors[index];
388
- path.setAttribute("fill", originalFill);
389
- });
390
- return tempDiv.innerHTML;
391
- });
371
+ if (props.svgoverride && svgContent) {
372
+ const tempDiv = document.createElement("div");
373
+ tempDiv.innerHTML = svgContent;
374
+ const svgElement = tempDiv.querySelector("svg");
375
+ const paths = svgElement?.querySelectorAll("path");
376
+ paths?.forEach((path) => path.removeAttribute("fill"));
377
+ setSvgContent(tempDiv.innerHTML);
392
378
  }
393
379
  };
394
380
  return /* @__PURE__ */ React11.createElement(
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@apexcura/ui-components",
3
- "version": "0.0.14-Beta44",
3
+ "version": "0.0.14-Beta46",
4
4
  "description": "Apex cura React components library",
5
5
  "keywords": [
6
6
  "apex cura",