@deviceinsight/ng-ui-components 6.30.0 → 7.1.0

package/lib/esm/src/components/reactableWithClientSidePagination/__tests__/ReactableWithClientSidePagination.spec.js

@@ -1,130 +0,0 @@
-import * as React from 'react';
-import { describe, expect, it, vi } from 'vitest';
-import { act, fireEvent, render } from '@testing-library/react';
-import ReactableWithClientSidePagination from '../ReactableWithClientSidePagination';
-const ITEMS = [
-    { id: 1, name: 'Hans Wurst', description: 'Lorem ipsum dolor sit amet, consectetur adipisici elit' },
-    { id: 2, name: 'August Tina', description: "Hopfen und Malz, Gott erhalt's" },
-    { id: 3, name: 'Paul Aner', description: 'Salve pater patriae' },
-    { id: 4, name: 'Franz Iskaner', description: 'Da braut sich was zusammen' }
-];
-const INITIAL_PAGINATION_SETTINGS = {
-    page: 0,
-    size: ITEMS.length,
-    sort: { property: 'name', direction: 'ASC' }
-};
-const COLUMN_DEFS = [
-    {
-        name: 'name',
-        render: (item) => item.name,
-        filterable: {
-            filterType: 'text',
-            filterFn: (item, value) => new RegExp(value).test(item.name)
-        }
-    },
-    {
-        name: 'description',
-        render: (item) => item.description
-    }
-];
-const COMMON_PROPS = {
-    columnDefs: COLUMN_DEFS,
-    uniqueItemKey: (item) => item.id,
-    paginationSettings: INITIAL_PAGINATION_SETTINGS,
-    items: ITEMS,
-    selectable: true,
-    isLoading: false
-};
-describe('ReactableWithClientSidePagination.js', () => {
-    describe('selectable feature', () => {
-        it('should match snapshot', () => {
-            const ReactableWithClientSidePaginationWrapper = render(
-            // @ts-ignore
-            React.createElement(ReactableWithClientSidePagination, { ...COMMON_PROPS, selectedItems: [], onSelectedItemsChange: () => { }, tableName: 'test' }));
-            expect(ReactableWithClientSidePaginationWrapper).toMatchSnapshot();
-        });
-        it('should call the callback with correct argument when checkbox is checked', async () => {
-            const selectedItemsBefore = [1, 2];
-            const selectedItemsAfter = [1, 2, 4];
-            const selectedItemsChangeHandler = vi.fn();
-            const { getAllByRole } = render(
-            // @ts-ignore
-            React.createElement(ReactableWithClientSidePagination, { ...COMMON_PROPS, selectedItems: selectedItemsBefore, onSelectedItemsChange: selectedItemsChangeHandler }));
-            const checkbox = getAllByRole('checkbox')[2];
-            await act(async () => {
-                fireEvent.click(checkbox);
-            });
-            // @ts-ignore
-            expect(selectedItemsChangeHandler.mock.calls[0][0]).toEqual(selectedItemsAfter);
-        });
-        it('should call the callback with correct argument when checkbox is unchecked', async () => {
-            const selectedItemsBefore = [1, 2, 4];
-            const selectedItemsAfter = [1, 2];
-            const selectedItemsChangeHandler = vi.fn();
-            const { getAllByRole } = render(
-            // @ts-ignore
-            React.createElement(ReactableWithClientSidePagination, { ...COMMON_PROPS, selectedItems: selectedItemsBefore, onSelectedItemsChange: selectedItemsChangeHandler }));
-            const checkbox = getAllByRole('checkbox')[2];
-            await act(async () => {
-                fireEvent.click(checkbox);
-            });
-            expect(selectedItemsChangeHandler.mock.calls[0][0]).toEqual(selectedItemsAfter);
-        });
-        it('should call the callback with correct argument when the selectAll checkbox is checked', async () => {
-            const selectedItemsBefore = [1];
-            const selectedItemsAfter = [1, 2, 3, 4];
-            const selectedItemsChangeHandler = vi.fn();
-            const { getByTitle } = render(
-            // @ts-ignore
-            React.createElement(ReactableWithClientSidePagination, { ...COMMON_PROPS, selectedItems: selectedItemsBefore, onSelectedItemsChange: selectedItemsChangeHandler }));
-            const checkbox = getByTitle('components.filtertable.selectAllItems');
-            await act(async () => {
-                fireEvent.click(checkbox);
-            });
-            expect(selectedItemsChangeHandler.mock.calls[0][0]).toEqual(selectedItemsAfter);
-        });
-        it('should call the callback with correct argument when the selectAll checkbox is unchecked', async () => {
-            const selectedItemsBefore = [1, 2, 3, 4];
-            const selectedItemsAfter = [];
-            const selectedItemsChangeHandler = vi.fn();
-            const { getByTitle } = render(
-            // @ts-ignore
-            React.createElement(ReactableWithClientSidePagination, { ...COMMON_PROPS, selectedItems: selectedItemsBefore, onSelectedItemsChange: selectedItemsChangeHandler }));
-            const checkbox = getByTitle('components.filtertable.selectAllItems');
-            await act(async () => {
-                fireEvent.click(checkbox);
-            });
-            expect(selectedItemsChangeHandler.mock.calls[0][0]).toEqual(selectedItemsAfter);
-        });
-        it('should select all available items if selectAll checkbox is checked and data is filtered', async () => {
-            const selectedItemsBefore = [1, 4];
-            const selectedItemsAfter = [1, 2, 4];
-            const selectedItemsChangeHandler = vi.fn();
-            const { getByTitle, getByRole } = render(
-            // @ts-ignore
-            React.createElement(ReactableWithClientSidePagination, { ...COMMON_PROPS, selectedItems: selectedItemsBefore, onSelectedItemsChange: selectedItemsChangeHandler }));
-            const filterInput = getByRole('textbox');
-            const checkbox = getByTitle('components.filtertable.selectAllItems');
-            await act(async () => {
-                fireEvent.change(filterInput, { target: { value: ITEMS[1].name } });
-                fireEvent.click(checkbox);
-            });
-            expect(selectedItemsChangeHandler.mock.calls[0][0]).toEqual(selectedItemsAfter);
-        });
-        it('should unselect all available items if selectAll checkbox is checked and data is filtered', async () => {
-            const selectedItemsBefore = [1, 2, 3, 4];
-            const selectedItemsAfter = [1, 3, 4];
-            const selectedItemsChangeHandler = vi.fn();
-            const { getByTitle, getByRole } = render(
-            // @ts-ignore
-            React.createElement(ReactableWithClientSidePagination, { ...COMMON_PROPS, selectedItems: selectedItemsBefore, onSelectedItemsChange: selectedItemsChangeHandler }));
-            const filterInput = getByRole('textbox');
-            const checkbox = getByTitle('components.filtertable.selectAllItems');
-            await act(async () => {
-                fireEvent.change(filterInput, { target: { value: ITEMS[1].name } });
-                fireEvent.click(checkbox);
-            });
-            expect(selectedItemsChangeHandler.mock.calls[0][0]).toEqual(selectedItemsAfter);
-        });
-    });
-});

package/lib/esm/src/components/slider/Slider.d.ts

@@ -1,30 +0,0 @@
-import React from 'react';
-export declare type Props = {
-    /** minimum value the slider renders */
-    min: number;
-    /** maximum value the slider renders */
-    max: number;
-    /** step in which increments/decrements have to be made */
-    step?: number;
-    /** current value of the slider */
-    value: number;
-    /** show or hide tooltip (default: true) */
-    tooltip?: boolean;
-    /** object containing key-value pairs to label the slider */
-    labels?: Record<string, number | string>;
-    /** formats the value in label or tooltip */
-    format?: (value: number) => string;
-    /** gets called whenever the slider handle is being dragged or clicked */
-    onChange?: (value: number) => void;
-    /** gets called whenever the user stops dragging the slider handle */
-    onChangeComplete?: (value: number) => void;
-    /**  maximum value the slider can hold */
-    limit?: number;
-};
-/**
- * Enables picking the desired value from a specified range.
- * Can have a tooltip and labels
- */
-declare const Slider: ({ min, max, step, value, tooltip, labels, format, onChange, onChangeComplete, limit }: Props) => React.JSX.Element;
-export default Slider;
-//# sourceMappingURL=Slider.d.ts.map

package/lib/esm/src/components/slider/Slider.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../../../src/components/slider/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,oBAAY,KAAK,GAAG;IACnB,uCAAuC;IACvC,GAAG,EAAE,MAAM,CAAC;IAEZ,uCAAuC;IACvC,GAAG,EAAE,MAAM,CAAC;IAEZ,0DAA0D;IAC1D,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,kCAAkC;IAClC,KAAK,EAAE,MAAM,CAAC;IAEd,2CAA2C;IAC3C,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;IAEzC,4CAA4C;IAC5C,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAEnC,yEAAyE;IACzE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAEnC,qEAAqE;IACrE,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAE3C,yCAAyC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAIF;;;GAGG;AACH,QAAA,MAAM,MAAM,0FAAgG,KAAK,sBAoChH,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/lib/esm/src/components/slider/Slider.js

@@ -1,35 +0,0 @@
-import React from 'react';
-import RcSlider, { createSliderWithTooltip } from 'rc-slider';
-import useLimitStyling from './useLimitStyling';
-const RcSliderWithTooltip = createSliderWithTooltip(RcSlider);
-/**
- * Enables picking the desired value from a specified range.
- * Can have a tooltip and labels
- */
-const Slider = ({ min, max, step, value, tooltip = true, labels, format, onChange, onChangeComplete, limit }) => {
-    const setSliderRef = useLimitStyling(limit, min, max);
-    const handleChange = (value) => {
-        if (!onChange)
-            return;
-        const numericValue = typeof value === 'number' ? value : value[0];
-        const allowedValue = limit != null ? Math.min(numericValue, limit) : numericValue;
-        onChange(allowedValue);
-    };
-    const handleChangeComplete = () => {
-        if (!onChangeComplete) {
-            return;
-        }
-        onChangeComplete(value);
-    };
-    const basicProps = {
-        min,
-        max,
-        step,
-        value,
-        onChange: handleChange,
-        onAfterChange: handleChangeComplete,
-        marks: labels
-    };
-    return (React.createElement("div", { className: "di slider", ref: setSliderRef }, tooltip ? (React.createElement(RcSliderWithTooltip, { ...basicProps, className: "di slider with-tooltip", tipFormatter: format })) : (React.createElement(RcSlider, { ...basicProps, className: "di slider" }))));
-};
-export default Slider;

package/lib/esm/src/components/slider/useLimitStyling.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-export default function useLimitStyling(limit: number | undefined, min: number, max: number): import("react").Dispatch<import("react").SetStateAction<HTMLDivElement | null>>;
-//# sourceMappingURL=useLimitStyling.d.ts.map

package/lib/esm/src/components/slider/useLimitStyling.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useLimitStyling.d.ts","sourceRoot":"","sources":["../../../../../src/components/slider/useLimitStyling.ts"],"names":[],"mappings":";AAEA,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,mFAiD1F"}

package/lib/esm/src/components/slider/useLimitStyling.js

@@ -1,49 +0,0 @@
-import { useCallback, useEffect, useState } from 'react';
-export default function useLimitStyling(limit, min, max) {
-    const [slider, setSlider] = useState(null);
-    useEffect(() => {
-        if (slider) {
-            const containerEl = slider.querySelector('.rc-slider-rail');
-            if (!containerEl)
-                throw new Error('.rc-slider-rail element missing');
-            const disabledAreaEl = containerEl?.querySelector(`.disabled-area-element`);
-            const sliderWidth = containerEl.getBoundingClientRect().width;
-            if (disabledAreaEl) {
-                if (limit == null) {
-                    disabledAreaEl.remove();
-                }
-                else {
-                    const width = Math.round(((max - limit) / (max - min)) * sliderWidth);
-                    disabledAreaEl.style.width = `${width}px`;
-                }
-            }
-            else if (limit != null) {
-                const width = Math.round(((max - limit) / (max - min)) * sliderWidth);
-                const disabledAreaEl = document.createElement('div');
-                disabledAreaEl.classList.add('disabled-area-element');
-                disabledAreaEl.style.width = `${width}px`;
-                containerEl.appendChild(disabledAreaEl);
-            }
-        }
-    }, [limit, slider, min, max]);
-    const updateLimitAreaSize = useCallback(() => {
-        if (slider && limit != null) {
-            const containerEl = slider.querySelector('.rc-slider-rail');
-            if (!containerEl)
-                throw new Error('.rc-slider-rail element missing');
-            const disabledAreaEl = containerEl?.querySelector(`.disabled-area-element`);
-            const sliderWidth = containerEl.getBoundingClientRect().width;
-            if (disabledAreaEl) {
-                const width = Math.round(((max - limit) / (max - min)) * sliderWidth);
-                disabledAreaEl.style.width = `${width}px`;
-            }
-        }
-    }, [limit, max, min, slider]);
-    useEffect(() => {
-        if (slider) {
-            const resizeObserver = new ResizeObserver(() => updateLimitAreaSize());
-            resizeObserver.observe(slider);
-        }
-    }, [slider, updateLimitAreaSize]);
-    return setSlider;
-}

package/lib/esm/src/components/svg/SvgImage.d.ts

@@ -1,12 +0,0 @@
-import React from 'react';
-import { Modification } from './types';
-export declare type Props = {
-    /** base64 encoded content of the SVG file */
-    imageData: string | null | undefined;
-    /** list of modifications that should be applied to the svg elements */
-    modifications?: Modification[];
-    /** called with list of conflicting IDs which means IDs existing in the DOM and duplicated by the elements from the SVG */
-    onConflict?: (conflictingIds: string[]) => void;
-};
-export default function SvgImage({ imageData, modifications, onConflict }: Props): React.JSX.Element;
-//# sourceMappingURL=SvgImage.d.ts.map

package/lib/esm/src/components/svg/SvgImage.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SvgImage.d.ts","sourceRoot":"","sources":["../../../../../src/components/svg/SvgImage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAG/C,OAAO,EAAC,YAAY,EAAC,MAAM,SAAS,CAAC;AAIrC,oBAAY,KAAK,GAAG;IACnB,6CAA6C;IAC7C,SAAS,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IAErC,uEAAuE;IACvE,aAAa,CAAC,EAAE,YAAY,EAAE,CAAC;IAE/B,0HAA0H;IAC1H,UAAU,CAAC,EAAE,CAAC,cAAc,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CAChD,CAAC;AAyBF,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAAC,SAAS,EAAE,aAAa,EAAE,UAAU,EAAC,EAAE,KAAK,qBAiB7E"}

package/lib/esm/src/components/svg/SvgImage.js

@@ -1,37 +0,0 @@
-import React, { useEffect, useRef } from 'react';
-import { useHistory } from 'react-router-dom';
-import findConflicts from './utils/findConflicts';
-import renderSvg from './utils/renderSvg';
-function useGlobalStyleElement() {
-    const styleElementRef = useRef(null);
-    useEffect(() => {
-        const styleElement = document.createElement('style');
-        // WebKit hack
-        styleElement.appendChild(document.createTextNode(''));
-        if (document && document.head) {
-            document.head.appendChild(styleElement);
-        }
-        styleElementRef.current = styleElement;
-        return () => {
-            if (document && document.head && styleElement) {
-                document.head.removeChild(styleElement);
-            }
-        };
-    }, []);
-    return styleElementRef.current;
-}
-export default function SvgImage({ imageData, modifications, onConflict }) {
-    const svgWrapperRef = useRef(null);
-    const styleElement = useGlobalStyleElement();
-    const { push } = useHistory();
-    useEffect(() => {
-        const { current: wrapper } = svgWrapperRef;
-        if (wrapper && imageData) {
-            const svgElement = renderSvg(wrapper, imageData, modifications, styleElement, push);
-            if (svgElement && onConflict) {
-                return findConflicts(svgElement, onConflict);
-            }
-        }
-    }, [imageData, modifications, onConflict, push, styleElement]);
-    return React.createElement("div", { ref: svgWrapperRef });
-}

package/lib/esm/src/components/svg/storybookHelper.d.ts

@@ -1,7 +0,0 @@
-export declare const simpleImageData: string;
-export declare const simpleImageWithTextData: string;
-export declare const animatedXYDotData: string;
-export declare const animatedXDotData: string;
-export declare const imageWithIdData: string;
-export declare const rotatingImageData: string;
-//# sourceMappingURL=storybookHelper.d.ts.map

package/lib/esm/src/components/svg/storybookHelper.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"storybookHelper.d.ts","sourceRoot":"","sources":["../../../../../src/components/svg/storybookHelper.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,eAAe,QASpB,CAAC;AAET,eAAO,MAAM,uBAAuB,QAYnC,CAAC;AACF,eAAO,MAAM,iBAAiB,QAO7B,CAAC;AACF,eAAO,MAAM,gBAAgB,QAQ5B,CAAC;AAEF,eAAO,MAAM,eAAe,QAI1B,CAAC;AAEH,eAAO,MAAM,iBAAiB,QAY5B,CAAC"}

package/lib/esm/src/components/svg/storybookHelper.js

@@ -1,53 +0,0 @@
-const encode = (data) => 'data:image/svg+xml;base64,' + btoa(data);
-export const simpleImageData = encode(`<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="600" viewBox="-300 -300 600 600">
-<circle r="292.3"/>
-<g style="fill:#f1cd43" transform="scale(0.9783764)" id="content">
-	<circle r="50"/>
-	<path d="M75,0A75,75 0 0,0 37.5-64.951905L125-216.50635A250,250 0 0,1 250,0Z" id="bld"/>
-	<use xlink:href="#bld" transform="rotate(120)"/>
-	<use xlink:href="#bld" transform="rotate(240)"/>
-</g>
-</svg>`);
-export const simpleImageWithTextData = encode(`<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="600" viewBox="-300 -300 600 600">
-<circle r="292.3"/>
-<g style="fill:#f1cd43" transform="scale(0.9783764)" id="content">
-	<circle r="50"/>
-	<path d="M75,0A75,75 0 0,0 37.5-64.951905L125-216.50635A250,250 0 0,1 250,0Z" id="bld"/>
-	<use xlink:href="#bld" transform="rotate(120)"/>
-	<use xlink:href="#bld" transform="rotate(240)"/>
-</g>
-<text id="myText" font-size="35px" xml:space="preserve"><tspan  x="-230" y="-10">Google</tspan></text>
-</svg>`);
-export const animatedXYDotData = encode(`<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="600" viewBox="-300 -300 600 600">
-<rect style="fill:#f1cd43" x="-300" y="-300" width="600" height="600" />
-<circle id="myCircle" r="20" fill="#0000aa" cx="-170" cy="-20"/>
-</svg>
-`);
-export const animatedXDotData = encode(`<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="600" viewBox="-300 -300 600 600">
-<rect style="fill:#bababa" x="-300" y="-300" width="600" height="600" />
-<rect id="myCircle-boundaries" style="fill:#f1cd43" x="-100" y="-200" width="300" height="400" />
-<circle id="myCircle" r="15" fill="#0000aa" cx="-170" cy="-20"/>
-</svg>
-`);
-export const imageWithIdData = encode(`<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="100" viewBox="-300 -300 600 600">
-<rect id="myId" style="fill:#bababa" x="-300" y="-300" width="600" height="100" />
-</svg>
-`);
-export const rotatingImageData = encode(`<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="600" viewBox="-300 -300 600 600">
-<circle r="292.3"/>
-<g style="fill:#f1cd43" transform="translate(0, 0)" id="content">
-	<circle r="500" fill="transparent"/>
-	<circle r="50"/>
-    <path d="M75,0A75,75 0 0,0 37.5-64.951905L125-216.50635A250,250 0 0,1 250,0Z" id="bld"/>
-    <use xlink:href="#bld" transform="rotate(120)"/>
-    <use xlink:href="#bld" transform="rotate(240)"/>
-	</g>
-</g>
-</svg>
-`);

package/lib/esm/src/components/svg/types.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/components/svg/types.ts"],"names":[],"mappings":"AAAA,oBAAY,aAAa,GAAG;IAC3B,IAAI,EAAE,YAAY,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;CACf,CAAC;AACF,aAAK,OAAO,GAAG;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;CACf,CAAC;AACF,aAAK,QAAQ,GAAG;IACf,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CACf,CAAC;AACF,oBAAY,YAAY,GAAG;IAC1B,IAAI,EAAE,WAAW,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,YAAY,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AACF,oBAAY,gBAAgB,GAAG;IAC9B,IAAI,EAAE,eAAe,CAAC;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,kCAAkC,CAAC;IAC7C,OAAO,CAAC,EAAE,OAAO,GAAG,uBAAuB,GAAG,SAAS,CAAC;CACxD,CAAC;AACF,aAAK,aAAa,GAAG;IACpB,IAAI,EAAE,YAAY,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,EAAE,CAAC;CACrB,CAAC;AACF,oBAAY,SAAS,GAAG;IACvB,IAAI,EAAE,WAAW,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;CACjB,CAAC;AACF,oBAAY,SAAS,GAAG;IACvB,IAAI,EAAE,WAAW,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;CACjB,CAAC;AACF,oBAAY,UAAU,GAAG;IACxB,IAAI,EAAE,YAAY,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;CAClB,CAAC;AACF,aAAK,QAAQ,GAAG;IACf,IAAI,EAAE,UAAU,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CAChB,CAAC;AACF,oBAAY,YAAY,GACrB,aAAa,GACb,OAAO,GACP,QAAQ,GACR,YAAY,GACZ,gBAAgB,GAChB,aAAa,GACb,SAAS,GACT,SAAS,GACT,UAAU,GACV,QAAQ,CAAC"}

package/lib/esm/src/components/svg/types.js

@@ -1 +0,0 @@
-export {};

package/lib/esm/src/components/svg/utils/__tests__/getMutableNodeList.spec.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=getMutableNodeList.spec.d.ts.map

package/lib/esm/src/components/svg/utils/__tests__/getMutableNodeList.spec.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"getMutableNodeList.spec.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/svg/utils/__tests__/getMutableNodeList.spec.ts"],"names":[],"mappings":""}

package/lib/esm/src/components/svg/utils/__tests__/getMutableNodeList.spec.js

@@ -1,24 +0,0 @@
-import { describe, expect, it } from 'vitest';
-import getMutableNodeList, { parseFromString } from '../getMutableNodeList';
-const testDiFieldId = 'di-field-id-';
-const base64StringWithoutFieldIds = 'data:image/svg+xml;base64,PHN2Zz48aDE+SGk8L2gxPjwvc3ZnPg==';
-const base64StringWithFieldIds = 'data:image/svg+xml;base64,PHN2Zz48aDE+Tm9uLU11dGFibGU8L2gxPjxoMiBpZD0iZGktZmllbGQtaWQtIj5NdXRhYmxlPC9oMj48L3N2Zz4=';
-describe('get node list from svg base64 string', () => {
-    it('should return an empty list if no mutable nodes are found', () => {
-        const nodeList = getMutableNodeList(base64StringWithoutFieldIds, testDiFieldId);
-        expect(nodeList).toHaveLength(0);
-    });
-    it('should return a non-empty list if mutable nodes are found', () => {
-        const nodeList = getMutableNodeList(base64StringWithFieldIds, testDiFieldId);
-        expect(nodeList).toHaveLength(1);
-        expect(nodeList.item(0).innerHTML).toBe('Mutable');
-    });
-    it('should throw an error if there was a parsing error', () => {
-        expect(() => getMutableNodeList('wrong', testDiFieldId)).toThrow();
-    });
-    it('should remove the "svg:" namespace while parsing the input text', () => {
-        const html = '<svg:svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"><h1>Non-Mutable</h1><h2 id="di-field-id-">Mutable</h2></svg:svg>';
-        const document = parseFromString(`data:image/svg+xml;base64,${btoa(html)}`);
-        expect(document.children[0].nodeName).toEqual('svg');
-    });
-});

package/lib/esm/src/components/svg/utils/createHyperlinkModification.d.ts

@@ -1,4 +0,0 @@
-import { SetHyperlink } from '../types';
-export declare const SVG_NS = "http://www.w3.org/2000/svg";
-export default function createHyperlinkModification(element: HTMLElement, { hoverColor, internalLink, link }: SetHyperlink, globalStyleElement: HTMLStyleElement | null, onInternalLinkChange: ((link: string) => void) | undefined): void;
-//# sourceMappingURL=createHyperlinkModification.d.ts.map

package/lib/esm/src/components/svg/utils/createHyperlinkModification.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"createHyperlinkModification.d.ts","sourceRoot":"","sources":["../../../../../../src/components/svg/utils/createHyperlinkModification.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAC,MAAM,UAAU,CAAC;AAGtC,eAAO,MAAM,MAAM,+BAA+B,CAAC;AAEnD,MAAM,CAAC,OAAO,UAAU,2BAA2B,CAClD,OAAO,EAAE,WAAW,EACpB,EAAC,UAAU,EAAE,YAAY,EAAE,IAAI,EAAC,EAAE,YAAY,EAC9C,kBAAkB,EAAE,gBAAgB,GAAG,IAAI,EAC3C,oBAAoB,EAAE,CAAC,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG,SAAS,QAiB1D"}

package/lib/esm/src/components/svg/utils/createHyperlinkModification.js

@@ -1,35 +0,0 @@
-import { uuidV4 } from '../../../modules/utils/uuidGen';
-export const SVG_NS = 'http://www.w3.org/2000/svg';
-export default function createHyperlinkModification(element, { hoverColor, internalLink, link }, globalStyleElement, onInternalLinkChange) {
-    const anchor = wrapIntoAnchor(element);
-    if (!anchor)
-        return;
-    const uniqueClassName = `a${uuidV4(8)}`;
-    element.classList.add('anchor', uniqueClassName);
-    if (hoverColor && globalStyleElement?.sheet) {
-        globalStyleElement.sheet.insertRule(`.di.svg-image .anchor.${uniqueClassName}:hover, .di.svg-image .anchor.${uniqueClassName}:hover * { stroke: ${hoverColor} !important; }`);
-    }
-    anchor.setAttributeNS(SVG_NS, 'xlink:href', '#');
-    anchor.addEventListener('click', () => internalLink && onInternalLinkChange ? onInternalLinkChange(link) : window.open(link, '_newtab'));
-}
-function wrapIntoAnchor(wrappedElement) {
-    const parentNode = wrappedElement.parentNode;
-    if (!parentNode) {
-        return null;
-    }
-    const siblings = parentNode.childNodes;
-    if (!siblings) {
-        return null;
-    }
-    const index = Array.from(siblings).findIndex((el) => el === wrappedElement);
-    const wrapperElement = document.createElementNS(SVG_NS, 'a');
-    wrapperElement.appendChild(wrappedElement);
-    const siblingNode = siblings[index] || null;
-    if (siblingNode) {
-        parentNode.insertBefore(wrapperElement, siblingNode);
-    }
-    else {
-        parentNode.appendChild(wrapperElement);
-    }
-    return wrapperElement;
-}

package/lib/esm/src/components/svg/utils/createPositionModification.d.ts

@@ -1,3 +0,0 @@
-import { PositionX, PositionXY, PositionY } from '../types';
-export default function createPositionModification(element: HTMLElement, modification: PositionX | PositionY | PositionXY, svgElement: SVGSVGElement): void;
-//# sourceMappingURL=createPositionModification.d.ts.map

package/lib/esm/src/components/svg/utils/createPositionModification.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"createPositionModification.d.ts","sourceRoot":"","sources":["../../../../../../src/components/svg/utils/createPositionModification.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,SAAS,EAAE,UAAU,EAAE,SAAS,EAAC,MAAM,UAAU,CAAC;AAI1D,MAAM,CAAC,OAAO,UAAU,0BAA0B,CACjD,OAAO,EAAE,WAAW,EACpB,YAAY,EAAE,SAAS,GAAG,SAAS,GAAG,UAAU,EAChD,UAAU,EAAE,aAAa,QAgBzB"}

package/lib/esm/src/components/svg/utils/createPositionModification.js

@@ -1,19 +0,0 @@
-import { SVG } from '@svgdotjs/svg.js';
-const limitPercentagePosition = (position) => Math.max(0, Math.min(100, position));
-export default function createPositionModification(element, modification, svgElement) {
-    const svg = SVG(svgElement);
-    const targetId = element.getAttribute('id') || '';
-    const targetEl = svg.findOne(`#${targetId}`);
-    const boundariesEl = svg.findOne(`#${targetId}-boundaries`);
-    const bbox = boundariesEl ? boundariesEl.bbox() : svg.viewbox();
-    if (modification.type === 'positionX') {
-        targetEl.x(bbox.x + (limitPercentagePosition(modification.position) * bbox.width) / 100);
-    }
-    else if (modification.type === 'positionY') {
-        targetEl.y(bbox.y + (limitPercentagePosition(modification.position) * bbox.height) / 100);
-    }
-    else {
-        targetEl.x(bbox.x + (limitPercentagePosition(modification.positionX) * bbox.width) / 100);
-        targetEl.y(bbox.y + (limitPercentagePosition(modification.positionY) * bbox.height) / 100);
-    }
-}

package/lib/esm/src/components/svg/utils/findConflicts.d.ts

@@ -1,2 +0,0 @@
-export default function findConflicts(svgElement: SVGSVGElement, onConflict: (conflictingIds: string[]) => void): () => void;
-//# sourceMappingURL=findConflicts.d.ts.map

package/lib/esm/src/components/svg/utils/findConflicts.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"findConflicts.d.ts","sourceRoot":"","sources":["../../../../../../src/components/svg/utils/findConflicts.ts"],"names":[],"mappings":"AAiBA,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,UAAU,EAAE,aAAa,EAAE,UAAU,EAAE,CAAC,cAAc,EAAE,MAAM,EAAE,KAAK,IAAI,cAQ9G"}

package/lib/esm/src/components/svg/utils/findConflicts.js

@@ -1,23 +0,0 @@
-const CONFLICTING_IDS_DETECTION_DELAY = 500;
-const calculateIdCountsInElement = (element) => {
-    return Array.from(element.querySelectorAll('[id]'))
-        .map((element) => element.getAttribute('id'))
-        .reduce((acc, id) => {
-        if (id)
-            acc[id] = acc[id] + 1 || 1;
-        return acc;
-    }, {});
-};
-const findAllDuplicatedIdsInSvgElement = (svgElement) => {
-    const idCountsInDocument = calculateIdCountsInElement(document);
-    const idCountsInSvg = calculateIdCountsInElement(svgElement);
-    return Object.keys(idCountsInSvg).filter((key) => idCountsInSvg[key] < idCountsInDocument[key]);
-};
-export default function findConflicts(svgElement, onConflict) {
-    const timeoutId = setTimeout(() => {
-        if (onConflict) {
-            onConflict(findAllDuplicatedIdsInSvgElement(svgElement));
-        }
-    }, CONFLICTING_IDS_DETECTION_DELAY);
-    return () => clearTimeout(timeoutId);
-}

package/lib/esm/src/components/svg/utils/getMutableNodeList.d.ts

@@ -1,3 +0,0 @@
-export declare const parseFromString: (imageData: string) => Document;
-export default function (imageData: string, diFieldId: string): NodeListOf<Element>;
-//# sourceMappingURL=getMutableNodeList.d.ts.map

package/lib/esm/src/components/svg/utils/getMutableNodeList.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"getMutableNodeList.d.ts","sourceRoot":"","sources":["../../../../../../src/components/svg/utils/getMutableNodeList.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,eAAe,cAAe,MAAM,aAIhD,CAAC;AAEF,MAAM,CAAC,OAAO,WAAW,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,uBAG5D"}

package/lib/esm/src/components/svg/utils/getMutableNodeList.js

@@ -1,12 +0,0 @@
-// SvgImage uses the @svgdotjs/svg.js library that doesn't work with the <svg:svg>...</svg:svg> elements.
-// The naive solution - removing of the "svg:" namespace - solves the problem.
-const removeSvgNamespace = (xml) => xml.replace(/<svg:svg/g, '<svg').replace(/<\/svg:svg/g, '</svg');
-export const parseFromString = (imageData) => {
-    const parser = new DOMParser();
-    const xml = removeSvgNamespace(atob(imageData.replace('data:image/svg+xml;base64,', '')));
-    return parser.parseFromString(xml, 'image/svg+xml');
-};
-export default function (imageData, diFieldId) {
-    const doc = parseFromString(imageData);
-    return doc.querySelectorAll(`[id^="${diFieldId}"]`);
-}

package/lib/esm/src/components/svg/utils/getSvgElement.d.ts

@@ -1,3 +0,0 @@
-declare const _default: (imageData: string) => SVGSVGElement | null;
-export default _default;
-//# sourceMappingURL=getSvgElement.d.ts.map

package/lib/esm/src/components/svg/utils/getSvgElement.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"getSvgElement.d.ts","sourceRoot":"","sources":["../../../../../../src/components/svg/utils/getSvgElement.ts"],"names":[],"mappings":"oCAE2B,MAAM;AAAjC,wBAOE"}

package/lib/esm/src/components/svg/utils/getSvgElement.js

@@ -1,10 +0,0 @@
-import { parseFromString } from './getMutableNodeList';
-export default (imageData) => {
-    try {
-        const imageDoc = parseFromString(imageData);
-        return imageDoc.querySelector('svg');
-    }
-    catch (e) {
-        return null;
-    }
-};

package/lib/esm/src/components/svg/utils/renderSvg.d.ts

@@ -1,3 +0,0 @@
-import { Modification } from '../types';
-export default function renderSvg(svgWrapper: HTMLDivElement, imageData: string, modifications: Modification[] | undefined, globalStyleElement: HTMLStyleElement | null, onInternalLinkChange: ((link: string) => void) | undefined): SVGSVGElement | null;
-//# sourceMappingURL=renderSvg.d.ts.map

package/lib/esm/src/components/svg/utils/renderSvg.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"renderSvg.d.ts","sourceRoot":"","sources":["../../../../../../src/components/svg/utils/renderSvg.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,YAAY,EAAC,MAAM,UAAU,CAAC;AAMtC,MAAM,CAAC,OAAO,UAAU,SAAS,CAChC,UAAU,EAAE,cAAc,EAC1B,SAAS,EAAE,MAAM,EACjB,aAAa,EAAE,YAAY,EAAE,GAAG,SAAS,EACzC,kBAAkB,EAAE,gBAAgB,GAAG,IAAI,EAC3C,oBAAoB,EAAE,CAAC,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG,SAAS,GACxD,aAAa,GAAG,IAAI,CAqBtB"}