@apexcura/ui-components 0.0.14-Beta50 → 0.0.14-Beta51
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 +7 -11
- package/dist/index.mjs +7 -11
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -378,6 +378,7 @@ var MultipleSelectElement = (props) => {
|
|
|
378
378
|
var import_react11 = __toESM(require("react"));
|
|
379
379
|
var ButtonElement = (props) => {
|
|
380
380
|
const [svgContent, setSvgContent] = (0, import_react11.useState)(null);
|
|
381
|
+
const [originalSvgContent, setOriginalSvgContent] = (0, import_react11.useState)(null);
|
|
381
382
|
const [hoverColor, setHoverColor] = (0, import_react11.useState)(null);
|
|
382
383
|
(0, import_react11.useEffect)(() => {
|
|
383
384
|
if (props.icon) {
|
|
@@ -404,21 +405,21 @@ var ButtonElement = (props) => {
|
|
|
404
405
|
const computedHoverColor = getComputedStyle(tempSpan).color;
|
|
405
406
|
document.body.removeChild(tempSpan);
|
|
406
407
|
setHoverColor(computedHoverColor);
|
|
407
|
-
console.log("hoverColor", hoverColor);
|
|
408
408
|
}
|
|
409
409
|
svgElement.setAttribute(
|
|
410
410
|
"class",
|
|
411
411
|
`${props.className ? props.className : ""}`
|
|
412
412
|
);
|
|
413
413
|
setSvgContent(tempDiv.innerHTML);
|
|
414
|
+
setOriginalSvgContent(tempDiv.innerHTML);
|
|
414
415
|
}
|
|
415
416
|
}).catch((error) => console.error("Error fetching SVG:", error));
|
|
416
417
|
}
|
|
417
418
|
}, [props.icon, props.className]);
|
|
418
419
|
const handleMouseEnter = () => {
|
|
419
|
-
if (hoverColor &&
|
|
420
|
+
if (hoverColor && originalSvgContent) {
|
|
420
421
|
const tempDiv = document.createElement("div");
|
|
421
|
-
tempDiv.innerHTML =
|
|
422
|
+
tempDiv.innerHTML = originalSvgContent;
|
|
422
423
|
const svgElement = tempDiv.querySelector("svg");
|
|
423
424
|
const paths = svgElement?.querySelectorAll("path");
|
|
424
425
|
paths?.forEach((path) => path.setAttribute("fill", hoverColor));
|
|
@@ -426,13 +427,8 @@ var ButtonElement = (props) => {
|
|
|
426
427
|
}
|
|
427
428
|
};
|
|
428
429
|
const handleMouseLeave = () => {
|
|
429
|
-
if (
|
|
430
|
-
|
|
431
|
-
tempDiv.innerHTML = svgContent;
|
|
432
|
-
const svgElement = tempDiv.querySelector("svg");
|
|
433
|
-
const paths = svgElement?.querySelectorAll("path");
|
|
434
|
-
paths?.forEach((path) => path.removeAttribute("fill"));
|
|
435
|
-
setSvgContent(tempDiv.innerHTML);
|
|
430
|
+
if (originalSvgContent) {
|
|
431
|
+
setSvgContent(originalSvgContent);
|
|
436
432
|
}
|
|
437
433
|
};
|
|
438
434
|
return /* @__PURE__ */ import_react11.default.createElement(
|
|
@@ -449,7 +445,7 @@ var ButtonElement = (props) => {
|
|
|
449
445
|
className: "svg-container",
|
|
450
446
|
dangerouslySetInnerHTML: { __html: svgContent }
|
|
451
447
|
}
|
|
452
|
-
) : props.icon && /* @__PURE__ */ import_react11.default.createElement("img", { className: props.iconsClassName, src: props.icon }),
|
|
448
|
+
) : props.icon && /* @__PURE__ */ import_react11.default.createElement("img", { className: props.iconsClassName, src: props.icon, alt: props.label }),
|
|
453
449
|
props.label
|
|
454
450
|
);
|
|
455
451
|
};
|
package/dist/index.mjs
CHANGED
|
@@ -319,6 +319,7 @@ var MultipleSelectElement = (props) => {
|
|
|
319
319
|
import React11, { useEffect, useState as useState4 } from "react";
|
|
320
320
|
var ButtonElement = (props) => {
|
|
321
321
|
const [svgContent, setSvgContent] = useState4(null);
|
|
322
|
+
const [originalSvgContent, setOriginalSvgContent] = useState4(null);
|
|
322
323
|
const [hoverColor, setHoverColor] = useState4(null);
|
|
323
324
|
useEffect(() => {
|
|
324
325
|
if (props.icon) {
|
|
@@ -345,21 +346,21 @@ var ButtonElement = (props) => {
|
|
|
345
346
|
const computedHoverColor = getComputedStyle(tempSpan).color;
|
|
346
347
|
document.body.removeChild(tempSpan);
|
|
347
348
|
setHoverColor(computedHoverColor);
|
|
348
|
-
console.log("hoverColor", hoverColor);
|
|
349
349
|
}
|
|
350
350
|
svgElement.setAttribute(
|
|
351
351
|
"class",
|
|
352
352
|
`${props.className ? props.className : ""}`
|
|
353
353
|
);
|
|
354
354
|
setSvgContent(tempDiv.innerHTML);
|
|
355
|
+
setOriginalSvgContent(tempDiv.innerHTML);
|
|
355
356
|
}
|
|
356
357
|
}).catch((error) => console.error("Error fetching SVG:", error));
|
|
357
358
|
}
|
|
358
359
|
}, [props.icon, props.className]);
|
|
359
360
|
const handleMouseEnter = () => {
|
|
360
|
-
if (hoverColor &&
|
|
361
|
+
if (hoverColor && originalSvgContent) {
|
|
361
362
|
const tempDiv = document.createElement("div");
|
|
362
|
-
tempDiv.innerHTML =
|
|
363
|
+
tempDiv.innerHTML = originalSvgContent;
|
|
363
364
|
const svgElement = tempDiv.querySelector("svg");
|
|
364
365
|
const paths = svgElement?.querySelectorAll("path");
|
|
365
366
|
paths?.forEach((path) => path.setAttribute("fill", hoverColor));
|
|
@@ -367,13 +368,8 @@ var ButtonElement = (props) => {
|
|
|
367
368
|
}
|
|
368
369
|
};
|
|
369
370
|
const handleMouseLeave = () => {
|
|
370
|
-
if (
|
|
371
|
-
|
|
372
|
-
tempDiv.innerHTML = svgContent;
|
|
373
|
-
const svgElement = tempDiv.querySelector("svg");
|
|
374
|
-
const paths = svgElement?.querySelectorAll("path");
|
|
375
|
-
paths?.forEach((path) => path.removeAttribute("fill"));
|
|
376
|
-
setSvgContent(tempDiv.innerHTML);
|
|
371
|
+
if (originalSvgContent) {
|
|
372
|
+
setSvgContent(originalSvgContent);
|
|
377
373
|
}
|
|
378
374
|
};
|
|
379
375
|
return /* @__PURE__ */ React11.createElement(
|
|
@@ -390,7 +386,7 @@ var ButtonElement = (props) => {
|
|
|
390
386
|
className: "svg-container",
|
|
391
387
|
dangerouslySetInnerHTML: { __html: svgContent }
|
|
392
388
|
}
|
|
393
|
-
) : props.icon && /* @__PURE__ */ React11.createElement("img", { className: props.iconsClassName, src: props.icon }),
|
|
389
|
+
) : props.icon && /* @__PURE__ */ React11.createElement("img", { className: props.iconsClassName, src: props.icon, alt: props.label }),
|
|
394
390
|
props.label
|
|
395
391
|
);
|
|
396
392
|
};
|