@veracity/vui 0.6.2 → 0.7.0-beta.0

package/cjs/radio/radio.js

@@ -0,0 +1,123 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Radio = exports.RadioBase = void 0;
+const react_1 = __importStar(require("react"));
+const core_1 = require("../core");
+const icon_1 = __importDefault(require("../icon"));
+const t_1 = __importDefault(require("../t"));
+const utils_1 = require("../utils");
+const context_1 = require("./context");
+const RadioControl = core_1.styled.spanBox `
+	border-radius: 50%;
+	display: inline-flex;
+	flex-shrink: 0;
+	position: relative;
+	transition-duration: fast;
+`;
+const RadioInput = core_1.styled.input `
+	cursor: inherit;
+	height: 100%;
+	left: 0;
+	margin: 0;
+	opacity: 0;
+	padding: 0;
+	position: absolute;
+	top: 0;
+	width: 100%;
+	z-index: 1;
+`;
+exports.RadioBase = core_1.styled.labelBox `
+	align-items: center;
+	cursor: pointer;
+	display: inline-flex;
+	width: fit-content;
+
+	&:not([aria-disabled='true']):hover .vui-radioControl {
+		color: ${p => core_1.th.color(p.controlHoverColor)};
+	}
+
+	&[aria-disabled='true'] {
+		color: disabled.color;
+		cursor: not-allowed;
+
+		.vui-radioControl {
+			color: disabled.color;
+		}
+	}
+`;
+/**
+ * Allows selection of a single choice from a set of items. Handles controlled and uncontrolled modes.
+ * Uses icons to display itself in different states.
+ */
+exports.Radio = (0, core_1.vui)((props, ref) => {
+    var _a, _b;
+    const _c = (_a = (0, context_1.useRadioGroup)()) !== null && _a !== void 0 ? _a : {}, { defaultValue: groupDefaultValue, isChecked: groupIsChecked, onChange: groupOnChange, value: groupValue } = _c, radioGroupProps = __rest(_c, ["defaultValue", "isChecked", "onChange", "value"]);
+    const defaultIsChecked = groupIsChecked !== undefined ? groupIsChecked === props.value : undefined;
+    const mergedProps = Object.assign(Object.assign({}, radioGroupProps), props);
+    const _d = (0, core_1.omitThemingProps)(mergedProps), { checked = groupValue !== undefined ? props.value === groupValue : undefined, children, className, defaultChecked = groupDefaultValue !== undefined ? props.value === groupDefaultValue : undefined, disabled, icon: iconProp = 'cuiRadioUnselected', iconChecked = 'cuiRadioSelected', id, inputProps, inputRef, label, name, onChange, required, value } = _d, rest = __rest(_d, ["checked", "children", "className", "defaultChecked", "disabled", "icon", "iconChecked", "id", "inputProps", "inputRef", "label", "name", "onChange", "required", "value"]);
+    const [isChecked, setIsChecked] = (0, react_1.useState)((_b = defaultIsChecked !== null && defaultIsChecked !== void 0 ? defaultIsChecked : checked) !== null && _b !== void 0 ? _b : defaultChecked);
+    const styles = (0, core_1.useStyleConfig)('Radio', mergedProps);
+    const _e = styles.control, { color: controlColor, hoverColor } = _e, controlStyles = __rest(_e, ["color", "hoverColor"]);
+    const icon = isChecked ? iconChecked : iconProp;
+    const controlMr = children || label ? 1 : 0;
+    const color = isChecked ? controlColor : 'grey.60';
+    const controlHoverColor = isChecked ? hoverColor : 'grey.90';
+    (0, react_1.useEffect)(() => {
+        if (groupIsChecked !== undefined) {
+            setIsChecked(groupIsChecked === value);
+        }
+        else if (checked !== undefined) {
+            setIsChecked(checked);
+        }
+    }, [checked, groupIsChecked]);
+    function handleOnChange(e) {
+        groupOnChange === null || groupOnChange === void 0 ? void 0 : groupOnChange(e);
+        onChange === null || onChange === void 0 ? void 0 : onChange(e);
+    }
+    const aliasedProps = (0, utils_1.filterUndefined)({
+        'aria-disabled': disabled
+    });
+    return (react_1.default.createElement(exports.RadioBase, Object.assign({ className: (0, utils_1.cs)('vui-radio', className), controlHoverColor: controlHoverColor, ref: ref }, styles.container, aliasedProps, rest),
+        react_1.default.createElement(RadioControl, Object.assign({ className: "vui-radioControl", color: color, focusWithinRing: 3, mr: controlMr }, controlStyles),
+            react_1.default.createElement(RadioInput, Object.assign({ className: "vui-radioInput", onChange: handleOnChange, ref: inputRef, type: "radio" }, { checked, defaultChecked, disabled, id, name, required, value }, inputProps)),
+            react_1.default.createElement(icon_1.default, { className: "vui-radioIcon", h: "100%", name: icon, w: "100%" })), children !== null && children !== void 0 ? children : (label && (react_1.default.createElement(t_1.default, Object.assign({ className: "vui-radioLabel", lineHeight: "normal" }, styles.label), label)))));
+});
+exports.Radio.displayName = 'Radio';
+exports.default = exports.Radio;

package/cjs/radio/radioGroup.js

@@ -0,0 +1,78 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RadioGroup = exports.RadioGroupBase = void 0;
+const react_1 = __importStar(require("react"));
+const core_1 = require("../core");
+const utils_1 = require("../utils");
+const context_1 = require("./context");
+exports.RadioGroupBase = core_1.styled.divBox `
+	display: flex;
+	flex-direction: column;
+	gap: 1;
+`;
+/**
+ * Organizes layout and display of multiple radio buttons as a row or column.
+ * Exposes some props to the children via context.
+ */
+exports.RadioGroup = (0, core_1.vui)((props, ref) => {
+    const { className, colorScheme, defaultValue, disabled, isRow, name, onBlur, onChange, onFocus, size, value, variant } = props, rest = __rest(props, ["className", "colorScheme", "defaultValue", "disabled", "isRow", "name", "onBlur", "onChange", "onFocus", "size", "value", "variant"]);
+    const [isChecked, setIsChecked] = (0, react_1.useState)(value !== null && value !== void 0 ? value : defaultValue);
+    const handleOnChange = (0, react_1.useCallback)((e) => {
+        setIsChecked(e.target.value);
+        onChange === null || onChange === void 0 ? void 0 : onChange(e);
+    }, [onChange]);
+    const context = (0, react_1.useMemo)(() => (0, utils_1.filterUndefined)({
+        colorScheme,
+        defaultValue,
+        disabled,
+        isChecked,
+        name,
+        onBlur,
+        onChange: handleOnChange,
+        onFocus,
+        size,
+        value,
+        variant
+    }), [colorScheme, defaultValue, disabled, handleOnChange, isChecked, name, onBlur, onFocus, size, value, variant]);
+    const aliasedProps = (0, utils_1.filterUndefined)({
+        flexDirection: isRow ? 'row' : undefined
+    });
+    return (react_1.default.createElement(context_1.RadioGroupProvider, { value: context },
+        react_1.default.createElement(exports.RadioGroupBase, Object.assign({ className: (0, utils_1.cs)('vui-radioGroup', className), ref: ref }, aliasedProps, rest))));
+});
+exports.RadioGroup.displayName = 'RadioGroup';
+exports.default = exports.RadioGroup;

package/cjs/radio/theme.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function variantDefault(props) {
+    const { colorScheme: c } = props;
+    const control = {
+        color: `${c}.80`,
+        hoverColor: `${c}.90`
+    };
+    if (c === 'prussian') {
+        control.hoverColor = 'prussian.70';
+    }
+    return {
+        control
+    };
+}
+const baseStyle = {};
+const defaultProps = {
+    colorScheme: 'blue',
+    size: 'md',
+    variant: 'default'
+};
+const parts = ['container', 'control', 'label'];
+const sizes = {
+    sm: {
+        control: {
+            h: 16,
+            w: 16
+        },
+        label: {
+            size: 'sm'
+        }
+    },
+    md: {
+        control: {
+            h: 20,
+            w: 20
+        },
+        label: {
+            size: 'md'
+        }
+    },
+    lg: {
+        control: {
+            h: 24,
+            w: 24
+        },
+        label: {
+            size: 'lg'
+        }
+    }
+};
+const variants = {
+    default: variantDefault
+};
+exports.default = {
+    baseStyle,
+    defaultProps,
+    parts,
+    sizes,
+    variants
+};

package/cjs/skeleton/index.js

@@ -0,0 +1,24 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+__exportStar(require("./skeleton"), exports);
+var skeleton_1 = require("./skeleton");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(skeleton_1).default; } });
+__exportStar(require("./skeleton.types"), exports);

package/cjs/skeleton/skeleton.js

@@ -0,0 +1,35 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Skeleton = exports.SkeletonBase = void 0;
+const react_1 = __importDefault(require("react"));
+const core_1 = require("../core");
+const utils_1 = require("../utils");
+exports.SkeletonBase = core_1.styled.divBox `
+	animation: vui-pulse 1.5s ease-in-out 0.5s infinite;
+`;
+/** Displays one or more animated skeleton elements to signify loading content. */
+exports.Skeleton = (0, core_1.vui)((props, ref) => {
+    const _a = (0, core_1.omitThemingProps)(props), { className, repeat = 1 } = _a, rest = __rest(_a, ["className", "repeat"]);
+    const styles = (0, core_1.useStyleConfig)('Skeleton', props);
+    const arr = Array(repeat).fill(0);
+    const aliasedProps = (0, utils_1.filterUndefined)({
+        w: props.variant === 'circle' ? styles.h : undefined
+    });
+    return (react_1.default.createElement(react_1.default.Fragment, null, arr.map((_, i) => (react_1.default.createElement(exports.SkeletonBase, Object.assign({ className: (0, utils_1.cs)('vui-skeleton', className), key: i, ref: ref }, styles, aliasedProps, rest))))));
+});
+exports.Skeleton.displayName = 'Skeleton';
+exports.default = exports.Skeleton;

package/cjs/skeleton/theme.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function variantCircle(props) {
+    const { colorScheme: c } = props;
+    const styles = {
+        borderRadius: '50%',
+        bg: `${c}.20`
+    };
+    return styles;
+}
+function variantRectangle(props) {
+    const { colorScheme: c } = props;
+    const styles = {
+        borderRadius: 'md',
+        bg: `${c}.20`,
+        w: '100%'
+    };
+    return styles;
+}
+const baseStyle = {};
+const defaultProps = {
+    colorScheme: 'blue',
+    size: 'md',
+    variant: 'rect'
+};
+const sizes = {
+    xs: {
+        h: 24
+    },
+    sm: {
+        h: 32
+    },
+    md: {
+        h: 40
+    },
+    lg: {
+        h: 48
+    }
+};
+const variants = {
+    circle: variantCircle,
+    rect: variantRectangle
+};
+exports.default = {
+    baseStyle,
+    defaultProps,
+    sizes,
+    variants
+};

package/cjs/spinner/consts.d.ts

@@ -0,0 +1,36 @@
+import { Dict } from '../utils';
+export declare const spinnerPositionMapping: {
+    bottom: {
+        container: {
+            flexDirection: string;
+        };
+        circle: {
+            mb: number;
+        };
+    };
+    left: {
+        container: {
+            flexDirection: string;
+        };
+        circle: {
+            ml: number;
+        };
+    };
+    right: {
+        container: {
+            flexDirection: string;
+        };
+        circle: {
+            mr: number;
+        };
+    };
+    top: {
+        container: {
+            flexDirection: string;
+        };
+        circle: {
+            mt: number;
+        };
+    };
+};
+export declare const spinnerSpeedMapping: Dict<string>;

package/cjs/spinner/consts.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.spinnerSpeedMapping = exports.spinnerPositionMapping = void 0;
+exports.spinnerPositionMapping = {
+    bottom: {
+        container: { flexDirection: 'column' },
+        circle: { mb: 1 }
+    },
+    left: {
+        container: { flexDirection: 'row-reverse' },
+        circle: { ml: 1 }
+    },
+    right: {
+        container: { flexDirection: 'row' },
+        circle: { mr: 1 }
+    },
+    top: {
+        container: { flexDirection: 'column-reverse' },
+        circle: { mt: 1 }
+    }
+};
+exports.spinnerSpeedMapping = {
+    slow: '1s',
+    normal: '0.9s',
+    fast: '0.8s'
+};

package/cjs/spinner/index.js

@@ -0,0 +1,24 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+__exportStar(require("./spinner"), exports);
+var spinner_1 = require("./spinner");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(spinner_1).default; } });
+__exportStar(require("./spinner.types"), exports);

package/cjs/spinner/spinner.js

@@ -0,0 +1,51 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Spinner = exports.SpinnerCircle = void 0;
+const react_1 = __importDefault(require("react"));
+const box_1 = __importDefault(require("../box"));
+const core_1 = require("../core");
+const t_1 = __importDefault(require("../t"));
+const utils_1 = require("../utils");
+const consts_1 = require("./consts");
+exports.SpinnerCircle = core_1.styled.divBox `
+	border-radius: round;
+	display: flex;
+	flex-shrink: 0;
+`;
+/**
+ * Displays a spinning circular element with optional text to signify loading content.
+ * Handles different positioning scenarios, speeds and coloring of the circle.
+ */
+exports.Spinner = (0, core_1.vui)((props, ref) => {
+    var _a;
+    const { className, emptyColor, size, speed: speedProp = 'normal', text, textPosition = 'bottom', thickness } = props, rest = __rest(props, ["className", "emptyColor", "size", "speed", "text", "textPosition", "thickness"]);
+    const styles = (0, core_1.useStyleConfig)('Spinner', props);
+    const isCustomSize = typeof size === 'number';
+    const positionProps = consts_1.spinnerPositionMapping[textPosition];
+    const speed = (_a = consts_1.spinnerSpeedMapping[speedProp]) !== null && _a !== void 0 ? _a : speedProp;
+    const circleProps = (0, utils_1.filterUndefined)({
+        borderColor: emptyColor,
+        borderWidth: isCustomSize ? thickness !== null && thickness !== void 0 ? thickness : 4 : thickness,
+        h: isCustomSize ? size : undefined,
+        w: isCustomSize ? size : undefined
+    });
+    return (react_1.default.createElement(box_1.default, Object.assign({ center: true, className: (0, utils_1.cs)('vui-spinner', className), ref: ref, transitionDuration: "fast" }, styles.container, positionProps.container, rest),
+        react_1.default.createElement(exports.SpinnerCircle, Object.assign({ animation: `vui-spin ${speed} linear infinite`, className: "vui-spinnerCircle" }, styles.circle, positionProps.circle, circleProps)),
+        text && (react_1.default.createElement(t_1.default, Object.assign({ className: "vui-spinnerText" }, styles.text), text))));
+});
+exports.Spinner.displayName = 'Spinner';
+exports.default = exports.Spinner;

package/cjs/spinner/theme.js

@@ -0,0 +1,75 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function variantDefault(props) {
+    const { colorScheme: c } = props;
+    const container = {
+        color: `${c}.50`
+    };
+    const circle = {
+        borderColor: `${c}.20`,
+        borderTopColor: `${c}.50`
+    };
+    const text = {};
+    return { container, circle, text };
+}
+const baseStyle = {};
+const defaultProps = {
+    colorScheme: 'blue',
+    size: 'page',
+    variant: 'default'
+};
+const parts = ['container', 'circle', 'text'];
+const sizes = {
+    xs: {
+        circle: {
+            borderWidth: 1,
+            h: 16,
+            w: 16
+        }
+    },
+    sm: {
+        circle: {
+            borderWidth: 2,
+            h: 24,
+            w: 24
+        }
+    },
+    md: {
+        circle: {
+            borderWidth: 3,
+            h: 32,
+            w: 32
+        }
+    },
+    lg: {
+        circle: {
+            borderWidth: 3,
+            h: 40,
+            w: 40
+        }
+    },
+    card: {
+        circle: {
+            borderWidth: 4,
+            h: 60,
+            w: 60
+        }
+    },
+    page: {
+        circle: {
+            borderWidth: 5,
+            h: 80,
+            w: 80
+        }
+    }
+};
+const variants = {
+    default: variantDefault
+};
+exports.default = {
+    baseStyle,
+    defaultProps,
+    parts,
+    sizes,
+    variants
+};

package/cjs/svg/cache.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+/**
+ * Provides svg caching functionality to avoid redundant XHR requests.
+ * When the retrieved item doesn't exist in cache yet, a request is sent
+ * to its 'src' url. The request's promise is cached for that 'src' key
+ * and can be used for the whole session without repeating requests.
+ */
+class Cache {
+    constructor() {
+        this.cache = new Map();
+        this.add = (src, svg) => {
+            this.cache.set(src, svg);
+        };
+        this.get = (src) => {
+            const item = this.cache.get(src);
+            if (!item) {
+                const promise = fetch(src).then(res => res.text());
+                this.add(src, promise);
+                return promise;
+            }
+            return item;
+        };
+        this.reset = () => {
+            this.cache.clear();
+        };
+    }
+}
+const cache = new Cache();
+exports.default = cache;

package/cjs/svg/helpers.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.stringToHTML = exports.initState = exports.getSvgContent = exports.getAttributes = void 0;
+/** Returns an object with given element's HTML attributes. */
+function getAttributes(element) {
+    if (!element)
+        return {};
+    const attrs = Array.from(element.attributes);
+    return attrs.reduce((props, attr) => {
+        const { name, value } = attr;
+        props[name] = value;
+        return props;
+    }, {});
+}
+exports.getAttributes = getAttributes;
+/** Returns content of the SVG HTML string by stripping the svg tag. */
+function getSvgContent(html = '') {
+    return html.replace(/(<\/?svg(?:.|\n)*?>)|(\r\n|\n|\r)/gm, '');
+}
+exports.getSvgContent = getSvgContent;
+/** Returns object with initial state values. */
+function initState() {
+    return { content: '', svgAttributes: {} };
+}
+exports.initState = initState;
+/** Returns given HTML string as an HTML element. */
+function stringToHTML(html) {
+    const container = document.createElement('div');
+    container.innerHTML = html;
+    return container.firstElementChild;
+}
+exports.stringToHTML = stringToHTML;

package/cjs/svg/index.js

@@ -0,0 +1,24 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+__exportStar(require("./svg"), exports);
+var svg_1 = require("./svg");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(svg_1).default; } });
+__exportStar(require("./svg.types"), exports);