@veracity/vui 0.7.0-beta.1 → 0.7.0-beta.2

package/dist/cjs/button/button.js

@@ -93,7 +93,7 @@ exports.ButtonBase = core_1.styled.buttonBox `
  */
 exports.Button = (0, core_1.vui)((props, ref) => {
     var _a, _b, _c, _d;
-    const buttonGroupProps = (0, context_1.useButtonGroup)();
+    const buttonGroupProps = (0, context_1.useButtonGroupContext)();
     const mergedProps = Object.assign(Object.assign({}, buttonGroupProps), props);
     const { borderWidth: borderWidthProp, children, className, colorScheme: colorSchemeProp, disabled, icon, iconLeft, iconRight, isElevated, isFullWidth, isLoading, // eslint-disable-line
     isRound, isSplit, isTruncated, size, state = props.isLoading ? 'loading' : '', stateMapping, text, variant } = mergedProps, rest = __rest(mergedProps, ["borderWidth", "children", "className", "colorScheme", "disabled", "icon", "iconLeft", "iconRight", "isElevated", "isFullWidth", "isLoading", "isRound", "isSplit", "isTruncated", "size", "state", "stateMapping", "text", "variant"]);

package/dist/cjs/button/buttonIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"buttonIcon.d.ts","sourceRoot":"","sources":["../../../src/button/buttonIcon.tsx"],"names":[],"mappings":"AAGA,OAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAGzC,0CAA0C;AAC1C,eAAO,MAAM,UAAU,kDAIrB,CAAA;AAIF,eAAe,UAAU,CAAA"}
+{"version":3,"file":"buttonIcon.d.ts","sourceRoot":"","sources":["../../../src/button/buttonIcon.tsx"],"names":[],"mappings":"AAGA,OAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAIzC,0CAA0C;AAC1C,eAAO,MAAM,UAAU,kDAKrB,CAAA;AAIF,eAAe,UAAU,CAAA"}

package/dist/cjs/button/buttonIcon.js

@@ -1,4 +1,15 @@
 "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 };
 };
@@ -7,11 +18,13 @@ exports.ButtonIcon = void 0;
 const react_1 = __importDefault(require("react"));
 const core_1 = require("../core");
 const icon_1 = __importDefault(require("../icon"));
+const utils_1 = require("../utils");
 const context_1 = require("./context");
 /** Displays an icon within the Button. */
 exports.ButtonIcon = (0, core_1.vui)((props, ref) => {
-    const styles = (0, core_1.useStyleConfig)('Button', Object.assign(Object.assign({}, (0, context_1.useButton)()), props));
-    return react_1.default.createElement(icon_1.default, Object.assign({ className: "vui-buttonIcon", ref: ref }, styles.icon, props));
+    const { className } = props, rest = __rest(props, ["className"]);
+    const styles = (0, core_1.useStyleConfig)('Button', (0, context_1.useButtonContext)());
+    return react_1.default.createElement(icon_1.default, Object.assign({ className: (0, utils_1.cs)('vui-buttonIcon', className), ref: ref }, styles.icon, rest));
 });
 exports.ButtonIcon.displayName = 'ButtonIcon';
 exports.default = exports.ButtonIcon;

package/dist/cjs/button/buttonText.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"buttonText.d.ts","sourceRoot":"","sources":["../../../src/button/buttonText.tsx"],"names":[],"mappings":"AAGA,OAAU,EAAE,MAAM,EAAE,MAAM,MAAM,CAAA;AAGhC,6CAA6C;AAC7C,eAAO,MAAM,UAAU,gDAIrB,CAAA;AAIF,eAAe,UAAU,CAAA"}
+{"version":3,"file":"buttonText.d.ts","sourceRoot":"","sources":["../../../src/button/buttonText.tsx"],"names":[],"mappings":"AAGA,OAAU,EAAE,MAAM,EAAE,MAAM,MAAM,CAAA;AAIhC,6CAA6C;AAC7C,eAAO,MAAM,UAAU,gDAKrB,CAAA;AAIF,eAAe,UAAU,CAAA"}

package/dist/cjs/button/buttonText.js

@@ -1,4 +1,15 @@
 "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 };
 };
@@ -7,11 +18,13 @@ exports.ButtonText = void 0;
 const react_1 = __importDefault(require("react"));
 const core_1 = require("../core");
 const t_1 = __importDefault(require("../t"));
+const utils_1 = require("../utils");
 const context_1 = require("./context");
 /** Displays the text label of the button. */
 exports.ButtonText = (0, core_1.vui)((props, ref) => {
-    const styles = (0, core_1.useStyleConfig)('Button', Object.assign(Object.assign({}, (0, context_1.useButton)()), props));
-    return react_1.default.createElement(t_1.default, Object.assign({ className: "vui-buttonText", fontSize: "inherit", ref: ref }, styles.text, props));
+    const { className } = props, rest = __rest(props, ["className"]);
+    const styles = (0, core_1.useStyleConfig)('Button', (0, context_1.useButtonContext)());
+    return react_1.default.createElement(t_1.default, Object.assign({ className: (0, utils_1.cs)('vui-buttonText', className), fontSize: "inherit", ref: ref }, styles.text, rest));
 });
 exports.ButtonText.displayName = 'ButtonText';
 exports.default = exports.ButtonText;

package/dist/cjs/button/context.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { Dict } from '../utils';
-declare const ButtonProvider: import("react").Provider<Dict<any>>, useButton: () => Dict<any>;
-export { ButtonProvider, useButton };
+declare const ButtonProvider: import("react").Provider<Dict<any>>, useButtonContext: () => Dict<any>;
+export { ButtonProvider, useButtonContext };
 //# sourceMappingURL=context.d.ts.map

package/dist/cjs/button/context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/button/context.ts"],"names":[],"mappings":";AAAA,OAAO,EAAiB,IAAI,EAAE,MAAM,UAAU,CAAA;AAE9C,QAAA,MAAO,cAAc,uCAAE,SAAS,iBAA6C,CAAA;AAE7E,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,CAAA"}
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/button/context.ts"],"names":[],"mappings":";AAAA,OAAO,EAAiB,IAAI,EAAE,MAAM,UAAU,CAAA;AAE9C,QAAA,MAAO,cAAc,uCAAE,gBAAgB,iBAA6C,CAAA;AAEpF,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,CAAA"}

package/dist/cjs/button/context.js

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

package/dist/cjs/buttonGroup/context.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { Dict } from '../utils';
-declare const ButtonGroupProvider: import("react").Provider<Dict<any>>, useButtonGroup: () => Dict<any>;
-export { ButtonGroupProvider, useButtonGroup };
+declare const ButtonGroupProvider: import("react").Provider<Dict<any>>, useButtonGroupContext: () => Dict<any>;
+export { ButtonGroupProvider, useButtonGroupContext };
 //# sourceMappingURL=context.d.ts.map

package/dist/cjs/buttonGroup/context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/buttonGroup/context.ts"],"names":[],"mappings":";AAAA,OAAO,EAAiB,IAAI,EAAE,MAAM,UAAU,CAAA;AAE9C,QAAA,MAAO,mBAAmB,uCAAE,cAAc,iBAA6C,CAAA;AAEvF,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/buttonGroup/context.ts"],"names":[],"mappings":";AAAA,OAAO,EAAiB,IAAI,EAAE,MAAM,UAAU,CAAA;AAE9C,QAAA,MAAO,mBAAmB,uCAAE,qBAAqB,iBAA6C,CAAA;AAE9F,OAAO,EAAE,mBAAmB,EAAE,qBAAqB,EAAE,CAAA"}

package/dist/cjs/buttonGroup/context.js

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

package/dist/cjs/checkbox/checkbox.js

@@ -88,7 +88,7 @@ exports.CheckboxBase = core_1.styled.labelBox `
  */
 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 _b = (_a = (0, context_1.useCheckboxGroupContext)()) !== 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);

package/dist/cjs/checkbox/context.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { Dict } from '../utils';
-declare const CheckboxGroupProvider: import("react").Provider<Dict<any>>, useCheckboxGroup: () => Dict<any>;
-export { CheckboxGroupProvider, useCheckboxGroup };
+declare const CheckboxGroupProvider: import("react").Provider<Dict<any>>, useCheckboxGroupContext: () => Dict<any>;
+export { CheckboxGroupProvider, useCheckboxGroupContext };
 //# sourceMappingURL=context.d.ts.map

package/dist/cjs/checkbox/context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/checkbox/context.ts"],"names":[],"mappings":";AAAA,OAAO,EAAiB,IAAI,EAAE,MAAM,UAAU,CAAA;AAE9C,QAAA,MAAO,qBAAqB,uCAAE,gBAAgB,iBAA6C,CAAA;AAE3F,OAAO,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,CAAA"}
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/checkbox/context.ts"],"names":[],"mappings":";AAAA,OAAO,EAAiB,IAAI,EAAE,MAAM,UAAU,CAAA;AAE9C,QAAA,MAAO,qBAAqB,uCAAE,uBAAuB,iBAA6C,CAAA;AAElG,OAAO,EAAE,qBAAqB,EAAE,uBAAuB,EAAE,CAAA"}

package/dist/cjs/checkbox/context.js

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

package/dist/cjs/core/links.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"links.d.ts","sourceRoot":"","sources":["../../../src/core/links.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAiB,QAAQ,EAAE,cAAc,EAAmC,MAAM,OAAO,CAAA;AAEvG,OAAO,EAAE,IAAI,EAAE,WAAW,EAAkB,MAAM,UAAU,CAAA;AAG5D,oBAAY,SAAS,GAAG,IAAI,CAAC,MAAM,CAAC,CAAA;AAEpC,aAAK,gBAAgB,GAAG,CAAC,SAAS,EAAE,QAAQ,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC,CAAC,CAAA;AAIxE;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,IAAI,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,OAAO,UAcjE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,eAIjE;AAED,oDAAoD;AACpD,wBAAgB,QAAQ,qBASvB;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,GAAG,CAAC,EAAE,WAAW,EAAE,UAAU,CAAC,EAAE,OAAO,QAoCnE"}
+{"version":3,"file":"links.d.ts","sourceRoot":"","sources":["../../../src/core/links.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAiB,QAAQ,EAAE,cAAc,EAAmC,MAAM,OAAO,CAAA;AAEvG,OAAO,EAAE,IAAI,EAAE,WAAW,EAAkC,MAAM,UAAU,CAAA;AAG5E,oBAAY,SAAS,GAAG,IAAI,CAAC,MAAM,CAAC,CAAA;AAEpC,aAAK,gBAAgB,GAAG,CAAC,SAAS,EAAE,QAAQ,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC,CAAC,CAAA;AAIxE;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,IAAI,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,OAAO,UAcjE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,eAIjE;AAED,oDAAoD;AACpD,wBAAgB,QAAQ,qBASvB;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,GAAG,CAAC,EAAE,WAAW,EAAE,UAAU,CAAC,EAAE,OAAO,QAuCnE"}

package/dist/cjs/core/links.js

@@ -79,37 +79,38 @@ exports.useLinks = useLinks;
  */
 function useLoadLinks(env, isLoggedIn) {
     const [, setLinks] = useLinks();
+    // Load links from the CDN for the given environment.
+    const loadLinks = (env) => __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));
+            }
+        }
+        catch (_a) {
+            console.error('Failed to retrieve links');
+        }
+    });
+    /**
+     * Adds/removes loggedin=1 URL param for each link based on isLoggedIn arg.
+     * useCallbackRef is used here to prevent a stale closure in async loadLinks.
+     */
+    const updateLoggedInParam = (0, utils_1.useCallbackRef)((links) => {
+        return Object.keys(links).reduce((loggedInLinks, key) => {
+            loggedInLinks[key] = getLoggedInLink(links[key], isLoggedIn);
+            return loggedInLinks;
+        }, {});
+    });
     (0, react_1.useEffect)(() => {
         if (!env)
             return;
         loadLinks(env);
     }, [env]);
     (0, react_1.useEffect)(() => {
-        setLinks(links => updateLoggedInParam(links, isLoggedIn));
+        setLinks(updateLoggedInParam);
     }, [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;

package/dist/cjs/dialog/dialogBody.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialogBody.d.ts","sourceRoot":"","sources":["../../../src/dialog/dialogBody.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAEhD;;;;;GAKG;AACH,eAAO,MAAM,UAAU,wDA4CrB,CAAA;AAIF,eAAe,UAAU,CAAA"}
+{"version":3,"file":"dialogBody.d.ts","sourceRoot":"","sources":["../../../src/dialog/dialogBody.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAEhD;;;;;GAKG;AACH,eAAO,MAAM,UAAU,wDA6CrB,CAAA;AAIF,eAAe,UAAU,CAAA"}

package/dist/cjs/dialog/dialogBody.js

@@ -22,6 +22,17 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __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.DialogBody = void 0;
 const react_1 = __importStar(require("react"));
@@ -37,6 +48,7 @@ const context_1 = require("./context");
  */
 exports.DialogBody = (0, core_1.vui)((props, ref) => {
     var _a;
+    const { className } = props, rest = __rest(props, ["className"]);
     const { bodyId, icon, status } = (_a = (0, context_1.useDialogContext)()) !== null && _a !== void 0 ? _a : {};
     const styles = (0, core_1.useStyleConfig)('Dialog', (0, context_1.useDialogContext)());
     const [isScrolled, setIsScrolled] = (0, react_1.useState)(false);
@@ -56,7 +68,7 @@ exports.DialogBody = (0, core_1.vui)((props, ref) => {
     const borderProps = isScrolled ? { borderColor: 'grey.30' } : {};
     // Add more body padding when custom or status icon is displayed
     const paddingProps = (icon !== null && icon !== void 0 ? icon : status) !== undefined ? { px: 8 } : { px: 3 };
-    return (react_1.default.createElement(box_1.Box, Object.assign({ borderBottom: "1px solid transparent", borderTop: "1px solid transparent", className: "vui-dialogBody", column: true, id: bodyId, overflowY: "auto", pb: 2, pt: 1.5, ref: (0, utils_1.mergeRefs)(ref, bodyRef) }, borderProps, paddingProps, styles.body, props)));
+    return (react_1.default.createElement(box_1.Box, Object.assign({ borderBottom: "1px solid transparent", borderTop: "1px solid transparent", className: (0, utils_1.cs)('vui-dialogBody', className), column: true, id: bodyId, overflowY: "auto", pb: 2, pt: 1.5, ref: (0, utils_1.mergeRefs)(ref, bodyRef) }, borderProps, paddingProps, styles.body, rest)));
 });
 exports.DialogBody.displayName = 'DialogBody';
 exports.default = exports.DialogBody;

package/dist/cjs/dialog/dialogCancelButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialogCancelButton.d.ts","sourceRoot":"","sources":["../../../src/dialog/dialogCancelButton.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAA;AAExD,yFAAyF;AACzF,eAAO,MAAM,kBAAkB,mEAO7B,CAAA;AAIF,eAAe,kBAAkB,CAAA"}
+{"version":3,"file":"dialogCancelButton.d.ts","sourceRoot":"","sources":["../../../src/dialog/dialogCancelButton.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAA;AAExD,yFAAyF;AACzF,eAAO,MAAM,kBAAkB,mEAc7B,CAAA;AAIF,eAAe,kBAAkB,CAAA"}

package/dist/cjs/dialog/dialogCancelButton.js

@@ -1,4 +1,15 @@
 "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 };
 };
@@ -7,13 +18,15 @@ exports.DialogCancelButton = void 0;
 const react_1 = __importDefault(require("react"));
 const button_1 = require("../button");
 const core_1 = require("../core");
+const utils_1 = require("../utils");
 const context_1 = require("./context");
 /** Shows an outlined Button in the Dialog Footer, which by default closes the Dialog. */
 exports.DialogCancelButton = (0, core_1.vui)((props, ref) => {
     var _a;
+    const { className } = props, rest = __rest(props, ["className"]);
     const { onClose } = (_a = (0, context_1.useDialogContext)()) !== null && _a !== void 0 ? _a : {};
     const styles = (0, core_1.useStyleConfig)('Dialog', (0, context_1.useDialogContext)());
-    return (react_1.default.createElement(button_1.LineButton, Object.assign({ className: "vui-dialogCancelButton", onClick: onClose, ref: ref }, styles.cancelButton, props)));
+    return (react_1.default.createElement(button_1.LineButton, Object.assign({ className: (0, utils_1.cs)('vui-dialogCancelButton', className), onClick: onClose, ref: ref }, styles.cancelButton, rest)));
 });
 exports.DialogCancelButton.displayName = 'DialogCancelButton';
 exports.default = exports.DialogCancelButton;

package/dist/cjs/dialog/dialogCloseButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialogCloseButton.d.ts","sourceRoot":"","sources":["../../../src/dialog/dialogCloseButton.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAA;AAEvD,oFAAoF;AACpF,eAAO,MAAM,iBAAiB,kEAoB5B,CAAA;AAIF,eAAe,iBAAiB,CAAA"}
+{"version":3,"file":"dialogCloseButton.d.ts","sourceRoot":"","sources":["../../../src/dialog/dialogCloseButton.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAA;AAEvD,oFAAoF;AACpF,eAAO,MAAM,iBAAiB,kEAqB5B,CAAA;AAIF,eAAe,iBAAiB,CAAA"}

package/dist/cjs/dialog/dialogCloseButton.js

@@ -1,4 +1,15 @@
 "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 };
 };
@@ -7,13 +18,15 @@ exports.DialogCloseButton = void 0;
 const react_1 = __importDefault(require("react"));
 const button_1 = require("../button");
 const core_1 = require("../core");
+const utils_1 = require("../utils");
 const context_1 = require("./context");
 /** Shows a CloseButton in the Dialog Header, which by default closes the Dialog. */
 exports.DialogCloseButton = (0, core_1.vui)((props, ref) => {
     var _a;
+    const { className } = props, rest = __rest(props, ["className"]);
     const { onClose } = (_a = (0, context_1.useDialogContext)()) !== null && _a !== void 0 ? _a : {};
     const styles = (0, core_1.useStyleConfig)('Dialog', (0, context_1.useDialogContext)());
-    return (react_1.default.createElement(button_1.CloseButton, Object.assign({ activeBg: "grey.30", className: "vui-dialogCloseButton", color: "grey.80", hoverBg: "grey.20", onClick: onClose, position: "absolute", ref: ref, right: 16, size: "sm", top: 16 }, styles.closeButton, props)));
+    return (react_1.default.createElement(button_1.CloseButton, Object.assign({ activeBg: "grey.30", className: (0, utils_1.cs)('vui-dialogCloseButton', className), color: "grey.80", hoverBg: "grey.20", onClick: onClose, position: "absolute", ref: ref, right: 16, size: "sm", top: 16 }, styles.closeButton, rest)));
 });
 exports.DialogCloseButton.displayName = 'DialogCloseButton';
 exports.default = exports.DialogCloseButton;

package/dist/cjs/dialog/dialogFooter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialogFooter.d.ts","sourceRoot":"","sources":["../../../src/dialog/dialogFooter.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAIlD,kGAAkG;AAClG,eAAO,MAAM,YAAY,0DAevB,CAAA;AAIF,eAAe,YAAY,CAAA"}
+{"version":3,"file":"dialogFooter.d.ts","sourceRoot":"","sources":["../../../src/dialog/dialogFooter.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAIlD,kGAAkG;AAClG,eAAO,MAAM,YAAY,0DAuBvB,CAAA;AAIF,eAAe,YAAY,CAAA"}

package/dist/cjs/dialog/dialogFooter.js

@@ -24,9 +24,9 @@ const dialogCancelButton_1 = __importDefault(require("./dialogCancelButton"));
 const dialogSubmitButton_1 = __importDefault(require("./dialogSubmitButton"));
 /** Shows control buttons below the Dialog Body. By default includes cancel and submit buttons. */
 exports.DialogFooter = (0, core_1.vui)((props, ref) => {
-    const { cancelButton, children, submitButton } = props, rest = __rest(props, ["cancelButton", "children", "submitButton"]);
+    const { cancelButton, children, className, submitButton } = props, rest = __rest(props, ["cancelButton", "children", "className", "submitButton"]);
     const styles = (0, core_1.useStyleConfig)('Dialog', (0, context_1.useDialogContext)());
-    return (react_1.default.createElement(box_1.Box, Object.assign({ className: "vui-dialogFooter", justifyContent: "flex-end", p: 3, pt: 2, ref: ref }, styles.footer, rest), children !== null && children !== void 0 ? children : (react_1.default.createElement(react_1.default.Fragment, null,
+    return (react_1.default.createElement(box_1.Box, Object.assign({ className: (0, utils_1.cs)('vui-dialogFooter', className), justifyContent: "flex-end", p: 3, pt: 2, ref: ref }, styles.footer, rest), children !== null && children !== void 0 ? children : (react_1.default.createElement(react_1.default.Fragment, null,
         (0, utils_1.isJsx)(cancelButton) ? cancelButton : cancelButton && react_1.default.createElement(dialogCancelButton_1.default, Object.assign({}, cancelButton)),
         (0, utils_1.isJsx)(submitButton) ? submitButton : submitButton && react_1.default.createElement(dialogSubmitButton_1.default, Object.assign({}, submitButton))))));
 });

package/dist/cjs/dialog/dialogHeader.js

@@ -26,14 +26,14 @@ const dialogTitle_1 = __importDefault(require("./dialogTitle"));
 /** Shows title, status icon and close button above the Dialog Body. */
 exports.DialogHeader = (0, core_1.vui)((props, ref) => {
     var _a;
-    const { children, closeButton, icon: iconProp, title: titleProp } = props, rest = __rest(props, ["children", "closeButton", "icon", "title"]);
+    const { children, className, closeButton, icon: iconProp, title: titleProp } = props, rest = __rest(props, ["children", "className", "closeButton", "icon", "title"]);
     const { onClose, status } = (_a = (0, context_1.useDialogContext)()) !== null && _a !== void 0 ? _a : {};
     const styles = (0, core_1.useStyleConfig)('Dialog', (0, context_1.useDialogContext)());
     const icon = (0, utils_1.isString)(iconProp) ? { name: iconProp } : iconProp;
     const showCloseButton = Boolean(closeButton !== undefined ? closeButton : onClose);
     const showIcon = Boolean(icon || status);
     const title = (0, utils_1.isReactText)(titleProp) ? { text: titleProp } : titleProp;
-    return (react_1.default.createElement(box_1.Box, Object.assign({ className: "vui-dialogHeader", icon: icon, pb: 1.5, pl: 3, position: "relative", pr: 8, pt: 3, ref: ref }, styles.header, rest), children !== null && children !== void 0 ? children : (react_1.default.createElement(react_1.default.Fragment, null,
+    return (react_1.default.createElement(box_1.Box, Object.assign({ className: (0, utils_1.cs)('vui-dialogHeader', className), icon: icon, pb: 1.5, pl: 3, position: "relative", pr: 8, pt: 3, ref: ref }, styles.header, rest), children !== null && children !== void 0 ? children : (react_1.default.createElement(react_1.default.Fragment, null,
         (0, utils_1.isJsx)(icon) ? icon : showIcon && react_1.default.createElement(dialogIcon_1.default, Object.assign({}, icon)),
         (0, utils_1.isJsx)(title) ? title : title && react_1.default.createElement(dialogTitle_1.default, Object.assign({}, title)),
         (0, utils_1.isJsx)(closeButton) ? closeButton : showCloseButton && react_1.default.createElement(dialogCloseButton_1.default, null)))));

package/dist/cjs/dialog/dialogIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialogIcon.d.ts","sourceRoot":"","sources":["../../../src/dialog/dialogIcon.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAEhD,+EAA+E;AAC/E,eAAO,MAAM,UAAU,wDAMrB,CAAA;AAIF,eAAe,UAAU,CAAA"}
+{"version":3,"file":"dialogIcon.d.ts","sourceRoot":"","sources":["../../../src/dialog/dialogIcon.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAEhD,+EAA+E;AAC/E,eAAO,MAAM,UAAU,wDAOrB,CAAA;AAIF,eAAe,UAAU,CAAA"}

package/dist/cjs/dialog/dialogIcon.js

@@ -1,4 +1,15 @@
 "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 };
 };
@@ -7,15 +18,17 @@ exports.DialogIcon = void 0;
 const react_1 = __importDefault(require("react"));
 const core_1 = require("../core");
 const icon_1 = require("../icon");
+const utils_1 = require("../utils");
 const consts_1 = require("./consts");
 const context_1 = require("./context");
 /** Shows an icon based on a given status. Optionally, can be a custom icon. */
 exports.DialogIcon = (0, core_1.vui)((props, ref) => {
     var _a, _b;
+    const { className } = props, rest = __rest(props, ["className"]);
     const { status = '' } = (_a = (0, context_1.useDialogContext)()) !== null && _a !== void 0 ? _a : {};
     const styles = (0, core_1.useStyleConfig)('Dialog', (0, context_1.useDialogContext)());
     const { iconProps } = (_b = consts_1.dialogStatusMapping[status]) !== null && _b !== void 0 ? _b : {};
-    return react_1.default.createElement(icon_1.Icon, Object.assign({ className: "vui-dialogIcon", mr: 2, ref: ref }, styles.icon, iconProps, props));
+    return react_1.default.createElement(icon_1.Icon, Object.assign({ className: (0, utils_1.cs)('vui-dialogIcon', className), mr: 2, ref: ref }, styles.icon, iconProps, rest));
 });
 exports.DialogIcon.displayName = 'DialogIcon';
 exports.default = exports.DialogIcon;

package/dist/cjs/dialog/dialogSubmitButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialogSubmitButton.d.ts","sourceRoot":"","sources":["../../../src/dialog/dialogSubmitButton.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAA;AAExD,yFAAyF;AACzF,eAAO,MAAM,kBAAkB,mEAM7B,CAAA;AAIF,eAAe,kBAAkB,CAAA"}
+{"version":3,"file":"dialogSubmitButton.d.ts","sourceRoot":"","sources":["../../../src/dialog/dialogSubmitButton.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAA;AAExD,yFAAyF;AACzF,eAAO,MAAM,kBAAkB,mEAc7B,CAAA;AAIF,eAAe,kBAAkB,CAAA"}

package/dist/cjs/dialog/dialogSubmitButton.js

@@ -1,4 +1,15 @@
 "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 };
 };
@@ -7,11 +18,13 @@ exports.DialogSubmitButton = void 0;
 const react_1 = __importDefault(require("react"));
 const button_1 = require("../button");
 const core_1 = require("../core");
+const utils_1 = require("../utils");
 const context_1 = require("./context");
 /** Shows a button in the Dialog Footer, which triggers the main action of the Dialog. */
 exports.DialogSubmitButton = (0, core_1.vui)((props, ref) => {
+    const { className } = props, rest = __rest(props, ["className"]);
     const styles = (0, core_1.useStyleConfig)('Dialog', (0, context_1.useDialogContext)());
-    return (react_1.default.createElement(button_1.Button, Object.assign({ className: "vui-dialogSubmitButton", ml: 2, ref: ref, text: "Submit" }, styles.submitButton, props)));
+    return (react_1.default.createElement(button_1.Button, Object.assign({ className: (0, utils_1.cs)('vui-dialogSubmitButton', className), ml: 2, ref: ref, text: "Submit" }, styles.submitButton, rest)));
 });
 exports.DialogSubmitButton.displayName = 'DialogSubmitButton';
 exports.default = exports.DialogSubmitButton;

package/dist/cjs/dialog/dialogTitle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialogTitle.d.ts","sourceRoot":"","sources":["../../../src/dialog/dialogTitle.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAEjD,iHAAiH;AACjH,eAAO,MAAM,WAAW,wDAKtB,CAAA;AAIF,eAAe,WAAW,CAAA"}
+{"version":3,"file":"dialogTitle.d.ts","sourceRoot":"","sources":["../../../src/dialog/dialogTitle.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAEjD,iHAAiH;AACjH,eAAO,MAAM,WAAW,wDAMtB,CAAA;AAIF,eAAe,WAAW,CAAA"}

package/dist/cjs/dialog/dialogTitle.js

@@ -1,4 +1,15 @@
 "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 };
 };
@@ -7,13 +18,15 @@ exports.DialogTitle = void 0;
 const react_1 = __importDefault(require("react"));
 const core_1 = require("../core");
 const heading_1 = require("../heading");
+const utils_1 = require("../utils");
 const context_1 = require("./context");
 /** Shows a title in the Dialog Header. Receives id linked to aria-labelledby on the Dialog for accessibility. */
 exports.DialogTitle = (0, core_1.vui)((props, ref) => {
     var _a;
+    const { className } = props, rest = __rest(props, ["className"]);
     const { titleId } = (_a = (0, context_1.useDialogContext)()) !== null && _a !== void 0 ? _a : {};
     const styles = (0, core_1.useStyleConfig)('Dialog', (0, context_1.useDialogContext)());
-    return react_1.default.createElement(heading_1.H4, Object.assign({ className: "vui-dialogTitle", id: titleId, ref: ref }, styles.title, props));
+    return react_1.default.createElement(heading_1.H4, Object.assign({ className: (0, utils_1.cs)('vui-dialogTitle', className), id: titleId, ref: ref }, styles.title, rest));
 });
 exports.DialogTitle.displayName = 'DialogTitle';
 exports.default = exports.DialogTitle;

package/dist/cjs/footer/footerColumn.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"footerColumn.d.ts","sourceRoot":"","sources":["../../../src/footer/footerColumn.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAGlD,0FAA0F;AAC1F,QAAA,MAAM,YAAY,0DAkBhB,CAAA;AAEF,eAAe,YAAY,CAAA"}
+{"version":3,"file":"footerColumn.d.ts","sourceRoot":"","sources":["../../../src/footer/footerColumn.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAGlD,0FAA0F;AAC1F,QAAA,MAAM,YAAY,0DAkBhB,CAAA;AAEF,eAAe,YAAY,CAAA"}

package/dist/cjs/footer/footerColumn.js

@@ -17,12 +17,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const box_1 = __importDefault(require("../box"));
 const core_1 = require("../core");
+const utils_1 = require("../utils");
 const context_1 = require("./context");
 const footerSection_1 = __importDefault(require("./footerSection"));
 /** Organizes sections with links into a single column. Different width per breakpoint. */
 const FooterColumn = (0, core_1.vui)((props, ref) => {
-    const { children, sections } = props, rest = __rest(props, ["children", "sections"]);
+    const { children, className, sections } = props, rest = __rest(props, ["children", "className", "sections"]);
     const styles = (0, core_1.useStyleConfig)('Footer', (0, context_1.useFooterContext)());
-    return (react_1.default.createElement(box_1.default, Object.assign({ className: "vui-footerColumn", column: true, flex: { xs: '0 0 100%', sm: '0 0 50%', md: '0 0 25%' }, p: 1.5, ref: ref, spaceY: 4 }, styles.column, rest), children !== null && children !== void 0 ? children : sections === null || sections === void 0 ? void 0 : sections.map((section, index) => react_1.default.createElement(footerSection_1.default, Object.assign({ key: index }, section)))));
+    return (react_1.default.createElement(box_1.default, Object.assign({ className: (0, utils_1.cs)('vui-footerColumn', className), column: true, flex: { xs: '0 0 100%', sm: '0 0 50%', md: '0 0 25%' }, p: 1.5, ref: ref, spaceY: 4 }, styles.column, rest), children !== null && children !== void 0 ? children : sections === null || sections === void 0 ? void 0 : sections.map((section, index) => react_1.default.createElement(footerSection_1.default, Object.assign({ key: index }, section)))));
 });
 exports.default = FooterColumn;

package/dist/cjs/footer/footerContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"footerContent.d.ts","sourceRoot":"","sources":["../../../src/footer/footerContent.tsx"],"names":[],"mappings":"AAOA,yEAAyE;AACzE,eAAO,MAAM,aAAa,kEAMxB,CAAA;AAIF,eAAe,aAAa,CAAA"}
+{"version":3,"file":"footerContent.d.ts","sourceRoot":"","sources":["../../../src/footer/footerContent.tsx"],"names":[],"mappings":"AAQA,yEAAyE;AACzE,eAAO,MAAM,aAAa,kEAgBxB,CAAA;AAIF,eAAe,aAAa,CAAA"}

package/dist/cjs/footer/footerContent.js

@@ -1,4 +1,15 @@
 "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 };
 };
@@ -7,11 +18,13 @@ exports.FooterContent = void 0;
 const react_1 = __importDefault(require("react"));
 const box_1 = __importDefault(require("../box"));
 const core_1 = require("../core");
+const utils_1 = require("../utils");
 const context_1 = require("./context");
 /** Controls max-width of the content and centers itself horizontally. */
 exports.FooterContent = (0, core_1.vui)((props, ref) => {
+    const { className } = props, rest = __rest(props, ["className"]);
     const styles = (0, core_1.useStyleConfig)('Footer', (0, context_1.useFooterContext)());
-    return (react_1.default.createElement(box_1.default, Object.assign({ className: "vui-footerContent", column: true, maxW: 1200, mx: "auto", ref: ref, w: "100%" }, styles.content, props)));
+    return (react_1.default.createElement(box_1.default, Object.assign({ className: (0, utils_1.cs)('vui-footerContent', className), column: true, maxW: 1200, mx: "auto", ref: ref, w: "100%" }, styles.content, rest)));
 });
 exports.FooterContent.displayName = 'FooterContent';
 exports.default = exports.FooterContent;

package/dist/cjs/footer/footerHeading.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"footerHeading.d.ts","sourceRoot":"","sources":["../../../src/footer/footerHeading.tsx"],"names":[],"mappings":"AAGA,OAAgB,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAGlD,kCAAkC;AAClC,eAAO,MAAM,aAAa,oDAIxB,CAAA;AAIF,eAAe,aAAa,CAAA"}
+{"version":3,"file":"footerHeading.d.ts","sourceRoot":"","sources":["../../../src/footer/footerHeading.tsx"],"names":[],"mappings":"AAGA,OAAgB,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAIlD,kCAAkC;AAClC,eAAO,MAAM,aAAa,oDAOxB,CAAA;AAIF,eAAe,aAAa,CAAA"}