@veracity/vui 0.6.1 → 0.7.0-beta.0

package/cjs/buttonGroup/buttonGroup.js

@@ -0,0 +1,84 @@
+"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.ButtonGroup = exports.ButtonGroupBase = void 0;
+const react_1 = __importStar(require("react"));
+const core_1 = require("../core");
+const utils_1 = require("../utils");
+const context_1 = require("./context");
+const helpers_1 = require("./helpers");
+exports.ButtonGroupBase = core_1.styled.divBox `
+	display: flex;
+
+	// Border color between Buttons
+	> *:not(:last-of-type):not(:focus) {
+		border-right-color: ${p => core_1.th.color(p.innerBorderColor)};
+	}
+
+	// First Button
+	> *:first-of-type:not(:last-of-type) {
+		border-bottom-right-radius: 0;
+		border-right-width: 1px;
+		border-top-right-radius: 0;
+	}
+
+	// Middle Buttons
+	> *:not(:first-of-type):not(:last-of-type) {
+		border-left-width: 0px;
+		border-radius: 0;
+		border-right-width: 1px;
+	}
+
+	// Last Button
+	> *:not(:first-of-type):last-of-type {
+		border-bottom-left-radius: 0;
+		border-left-width: 0px;
+		border-top-left-radius: 0;
+	}
+`;
+/**
+ * Organizes layout and display of multiple buttons. Controls border visual around and between the buttons.
+ * Exposes some props to the children via context.
+ */
+exports.ButtonGroup = (0, core_1.vui)((props, ref) => {
+    const { className, colorScheme, disabled, size, variant } = props, rest = __rest(props, ["className", "colorScheme", "disabled", "size", "variant"]);
+    const innerBorderColor = (0, helpers_1.getInnerBorderColor)(props);
+    const context = (0, react_1.useMemo)(() => (0, utils_1.filterUndefined)({ colorScheme, disabled, size, variant }), [colorScheme, disabled, size, variant]);
+    return (react_1.default.createElement(context_1.ButtonGroupProvider, { value: context },
+        react_1.default.createElement(exports.ButtonGroupBase, Object.assign({ className: (0, utils_1.cs)('vui-buttonGroup', className) }, { innerBorderColor, ref }, rest))));
+});
+exports.ButtonGroup.displayName = 'ButtonGroup';
+exports.default = exports.ButtonGroup;

package/cjs/buttonGroup/context.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { Dict } from '../utils';
+declare const ButtonGroupProvider: import("react").Provider<Dict<any>>, useButtonGroup: () => Dict<any>;
+export { ButtonGroupProvider, useButtonGroup };

package/cjs/buttonGroup/context.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useButtonGroup = exports.ButtonGroupProvider = void 0;
+const utils_1 = require("../utils");
+const [ButtonGroupProvider, useButtonGroup] = (0, utils_1.createContext)({ isOptional: true });
+exports.ButtonGroupProvider = ButtonGroupProvider;
+exports.useButtonGroup = useButtonGroup;

package/cjs/buttonGroup/helpers.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getInnerBorderColor = void 0;
+/** Returns appropriate color for the border between the buttons. */
+function getInnerBorderColor(props) {
+    const { colorScheme = 'prussian', disabled, variant = 'solid' } = props;
+    if (disabled)
+        return 'disabled.border';
+    const shade = variant === 'solid' ? '100' : '80';
+    return `${colorScheme}.${shade}`;
+}
+exports.getInnerBorderColor = getInnerBorderColor;

package/cjs/buttonGroup/index.js

@@ -0,0 +1,25 @@
+"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("./buttonGroup"), exports);
+var buttonGroup_1 = require("./buttonGroup");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(buttonGroup_1).default; } });
+__exportStar(require("./buttonGroup.types"), exports);
+__exportStar(require("./context"), exports);

package/cjs/card/card.js

@@ -0,0 +1,44 @@
+"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.Card = void 0;
+const react_1 = __importDefault(require("react"));
+const box_1 = __importDefault(require("../box"));
+const core_1 = require("../core");
+const utils_1 = require("../utils");
+/**
+ * Displays static, partially interactive or fully interactive content, such as text, images or buttons.
+ * Supports use cases like a single card or multiple tiles.
+ */
+exports.Card = (0, core_1.vui)((props, ref) => {
+    const _a = (0, core_1.omitThemingProps)(props), { className, isInteractive = props.onClick !== undefined } = _a, rest = __rest(_a, ["className", "isInteractive"]);
+    const styles = (0, core_1.useStyleConfig)('Card', props);
+    const interactiveProps = isInteractive
+        ? {
+            cursor: 'pointer',
+            focusRing: 2,
+            focusRingColor: 'blue.50',
+            hoverRingColor: 'prussian.80',
+            hoverShadow: '4',
+            outline: 'none',
+            tabIndex: 0,
+            userSelect: 'none'
+        }
+        : {};
+    return (react_1.default.createElement(box_1.default, Object.assign({ bg: "white", borderRadius: "md", className: (0, utils_1.cs)('vui-card', className), ref: ref, ring: 1, ringColor: "transparent", shadow: "2" }, styles, interactiveProps, rest)));
+});
+exports.Card.displayName = 'Card';
+exports.default = exports.Card;

package/cjs/card/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("./card"), exports);
+var card_1 = require("./card");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(card_1).default; } });
+__exportStar(require("./card.types"), exports);

package/cjs/card/theme.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const baseStyle = {};
+const defaultProps = {};
+const sizes = {};
+const variants = {};
+exports.default = {
+    baseStyle,
+    defaultProps,
+    sizes,
+    variants
+};

package/cjs/checkbox/checkbox.js

@@ -0,0 +1,118 @@
+"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.Checkbox = exports.CheckboxBase = 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 CheckboxControl = core_1.styled.spanBox `
+	border-radius: sm;
+	display: inline-flex;
+	flex-shrink: 0;
+	position: relative;
+	transition-duration: fast;
+`;
+const CheckboxInput = 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.CheckboxBase = core_1.styled.labelBox `
+	align-items: center;
+	cursor: pointer;
+	display: inline-flex;
+	width: fit-content;
+
+	&:not([aria-disabled='true']):hover .vui-checkboxControl {
+		color: ${p => core_1.th.color(p.controlHoverColor)};
+	}
+
+	&[aria-disabled='true'] {
+		color: disabled.color;
+		cursor: not-allowed;
+
+		.vui-checkboxControl {
+			color: disabled.color;
+		}
+	}
+`;
+/**
+ * Allows selection of one or more choices from a set of items. Handles controlled and uncontrolled modes.
+ * Uses icons to display itself in different states. Can be indeterminate when selecting some nested items.
+ */
+exports.Checkbox = (0, core_1.vui)((props, ref) => {
+    var _a;
+    const _b = (_a = (0, context_1.useCheckboxGroup)()) !== null && _a !== void 0 ? _a : {}, { defaultValue: groupDefaultValue } = _b, checkboxGroupProps = __rest(_b, ["defaultValue"]);
+    const mergedProps = Object.assign(Object.assign({}, checkboxGroupProps), props);
+    const _c = (0, core_1.omitThemingProps)(mergedProps), { checked, children, className, defaultChecked = groupDefaultValue !== undefined ? groupDefaultValue.includes(props.value) : undefined, disabled, icon: iconProp = 'cuiCheckboxUnselected', iconChecked = 'cuiCheckboxSelected', iconIndeterminate = 'cuiCheckboxIndeterminate', id, inputProps, inputRef, isIndeterminate, label, name, onChange, required, value } = _c, rest = __rest(_c, ["checked", "children", "className", "defaultChecked", "disabled", "icon", "iconChecked", "iconIndeterminate", "id", "inputProps", "inputRef", "isIndeterminate", "label", "name", "onChange", "required", "value"]);
+    const [isChecked, setIsChecked] = (0, react_1.useState)(defaultChecked);
+    const styles = (0, core_1.useStyleConfig)('Checkbox', mergedProps);
+    const _d = styles.control, { color: controlColor, hoverColor } = _d, controlStyles = __rest(_d, ["color", "hoverColor"]);
+    const isFilled = isChecked || isIndeterminate;
+    const icon = isIndeterminate ? iconIndeterminate : isChecked ? iconChecked : iconProp;
+    const controlMr = children || label ? 1 : 0;
+    const color = isFilled ? controlColor : 'grey.60';
+    const controlHoverColor = isFilled ? hoverColor : 'grey.90';
+    (0, react_1.useEffect)(() => {
+        checked !== undefined && setIsChecked(checked);
+    }, [checked]);
+    function handleOnChange(e) {
+        setIsChecked(e.target.checked);
+        onChange === null || onChange === void 0 ? void 0 : onChange(e);
+    }
+    const aliasedProps = (0, utils_1.filterUndefined)({
+        'aria-disabled': disabled
+    });
+    return (react_1.default.createElement(exports.CheckboxBase, Object.assign({ className: (0, utils_1.cs)('vui-checkbox', className), controlHoverColor: controlHoverColor, ref: ref }, styles.container, aliasedProps, rest),
+        react_1.default.createElement(CheckboxControl, Object.assign({ className: "vui-checkboxControl", color: color, focusWithinRing: 3, mr: controlMr }, controlStyles),
+            react_1.default.createElement(CheckboxInput, Object.assign({ className: "vui-checkboxInput", onChange: handleOnChange, ref: inputRef, type: "checkbox" }, { checked, defaultChecked, disabled, id, name, required, value }, inputProps)),
+            react_1.default.createElement(icon_1.default, { className: "vui-checkboxIcon", h: "100%", name: icon, w: "100%" })), children !== null && children !== void 0 ? children : (label && (react_1.default.createElement(t_1.default, Object.assign({ className: "vui-checkboxLabel", lineHeight: "normal" }, styles.label), label)))));
+});
+exports.Checkbox.displayName = 'Checkbox';
+exports.default = exports.Checkbox;

package/cjs/checkbox/checkboxGroup.js

@@ -0,0 +1,60 @@
+"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.CheckboxGroup = exports.CheckboxGroupBase = void 0;
+const react_1 = __importStar(require("react"));
+const core_1 = require("../core");
+const utils_1 = require("../utils");
+const context_1 = require("./context");
+exports.CheckboxGroupBase = core_1.styled.divBox `
+	display: flex;
+	flex-direction: column;
+`;
+/**
+ * Organizes layout and display of multiple checkboxes as a row or column.
+ * Exposes some props to the children via context.
+ */
+exports.CheckboxGroup = (0, core_1.vui)((props, ref) => {
+    const { className, colorScheme, defaultValue, disabled, isRow, name, onBlur, onChange, onFocus, size, variant } = props, rest = __rest(props, ["className", "colorScheme", "defaultValue", "disabled", "isRow", "name", "onBlur", "onChange", "onFocus", "size", "variant"]);
+    const context = (0, react_1.useMemo)(() => (0, utils_1.filterUndefined)({ colorScheme, defaultValue, disabled, name, onBlur, onChange, onFocus, size, variant }), [colorScheme, defaultValue, disabled, name, onBlur, onChange, onFocus, size, variant]);
+    const aliasedProps = (0, utils_1.filterUndefined)({
+        flexDirection: isRow ? 'row' : undefined
+    });
+    return (react_1.default.createElement(context_1.CheckboxGroupProvider, { value: context },
+        react_1.default.createElement(exports.CheckboxGroupBase, Object.assign({ className: (0, utils_1.cs)('vui-checkboxGroup', className), ref: ref }, aliasedProps, rest))));
+});
+exports.CheckboxGroup.displayName = 'CheckboxGroup';
+exports.default = exports.CheckboxGroup;

package/cjs/checkbox/context.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { Dict } from '../utils';
+declare const CheckboxGroupProvider: import("react").Provider<Dict<any>>, useCheckboxGroup: () => Dict<any>;
+export { CheckboxGroupProvider, useCheckboxGroup };

package/cjs/checkbox/context.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCheckboxGroup = exports.CheckboxGroupProvider = void 0;
+const utils_1 = require("../utils");
+const [CheckboxGroupProvider, useCheckboxGroup] = (0, utils_1.createContext)({ isOptional: true });
+exports.CheckboxGroupProvider = CheckboxGroupProvider;
+exports.useCheckboxGroup = useCheckboxGroup;

package/cjs/checkbox/index.js

@@ -0,0 +1,27 @@
+"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("./checkbox"), exports);
+var checkbox_1 = require("./checkbox");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(checkbox_1).default; } });
+__exportStar(require("./checkbox.types"), exports);
+__exportStar(require("./checkboxGroup"), exports);
+__exportStar(require("./checkboxGroup.types"), exports);
+__exportStar(require("./context"), exports);

package/cjs/checkbox/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/core/index.js

@@ -0,0 +1,23 @@
+"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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./consts"), exports);
+__exportStar(require("./links"), exports);
+__exportStar(require("./media"), exports);
+__exportStar(require("./styled"), exports);
+__exportStar(require("./theme"), exports);
+__exportStar(require("./vui"), exports);
+__exportStar(require("./vuiProvider"), exports);

package/cjs/core/links.js

@@ -0,0 +1,115 @@
+"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 __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useLoadLinks = exports.useLinks = exports.LinksProvider = exports.getLoggedInLink = void 0;
+const react_1 = __importStar(require("react"));
+const utils_1 = require("../utils");
+const consts_1 = require("./consts");
+const LinksContext = (0, react_1.createContext)(undefined);
+/**
+ * Adds loggedIn=1 parameter to the URL if 'isLoggedIn' flag is true, which means the user is logged in.
+ * If 'isLoggedIn' is falsy, loggedin param will be removed.
+ * This is supposed to aid login flow when navigating between Veracity applications.
+ */
+function getLoggedInLink(link, isLoggedIn) {
+    try {
+        const url = new URL(link);
+        if (isLoggedIn) {
+            url.searchParams.append('loggedin', '1');
+        }
+        else {
+            url.searchParams.delete('loggedin');
+        }
+        return url.toString();
+    }
+    catch (_a) {
+        return link;
+    }
+}
+exports.getLoggedInLink = getLoggedInLink;
+function LinksProvider(props) {
+    const linksState = (0, react_1.useState)({});
+    return react_1.default.createElement(LinksContext.Provider, Object.assign({ value: linksState }, props));
+}
+exports.LinksProvider = LinksProvider;
+/** Returns links and setLinks from LinksContext. */
+function useLinks() {
+    const context = (0, react_1.useContext)(LinksContext);
+    if (context === undefined) {
+        console.error('useLinks must be used within a LinksContext.');
+        return [{}, utils_1.noop];
+    }
+    return context;
+}
+exports.useLinks = useLinks;
+/**
+ * Retrieves the links from CDN for the given environment and appends them with loggedin=1 parameter
+ * if user is logged in. Links will be reloaded when 'env' changes or updated when 'isLoggedIn' changes.
+ */
+function useLoadLinks(env, isLoggedIn) {
+    const [, setLinks] = useLinks();
+    (0, react_1.useEffect)(() => {
+        if (!env)
+            return;
+        loadLinks(env);
+    }, [env]);
+    (0, react_1.useEffect)(() => {
+        setLinks(links => updateLoggedInParam(links, isLoggedIn));
+    }, [isLoggedIn]);
+    // Load links from the CDN for the given environment.
+    function loadLinks(env) {
+        return __awaiter(this, void 0, void 0, function* () {
+            try {
+                const response = yield fetch(`${consts_1.cdnUrls[env]}/common/data/links/base.json`);
+                if (!response.ok)
+                    return;
+                const data = yield response.json();
+                if ((0, utils_1.isObject)(data)) {
+                    setLinks(updateLoggedInParam(data, isLoggedIn));
+                }
+            }
+            catch (_a) {
+                console.error('Failed to retrieve links');
+            }
+        });
+    }
+    // Adds/removes loggedin=1 URL param for each link based on isLoggedIn arg.
+    function updateLoggedInParam(links, isLoggedIn) {
+        return Object.keys(links).reduce((loggedInLinks, key) => {
+            loggedInLinks[key] = getLoggedInLink(links[key], isLoggedIn);
+            return loggedInLinks;
+        }, {});
+    }
+}
+exports.useLoadLinks = useLoadLinks;