@televet/kibble-ui 1.12.2 → 1.12.3-beta.2wp810y.1

package/build/components/Forms/Checkbox/components/CheckboxGroup/checkboxGroup.component.d.ts

@@ -1,10 +1,10 @@
-import { CheckboxGroupProps as CCheckboxGroupProps, SystemProps } from '@chakra-ui/react';
-import { WithFormControlProps } from 'components/Forms/FormControl/formControl.component';
 import React from 'react';
+import { SystemProps } from '@chakra-ui/react';
+import { WithFormControlProps } from 'components/Forms/FormControl/formControl.component';
 import { FlexDirection } from 'shared/types';
 import { CheckboxProps } from '../../checkbox.component';
 import { CheckboxSize, CheckboxVariant } from '../../checkbox.types';
-export interface CheckboxGroupProps extends WithFormControlProps, CCheckboxGroupProps {
+export interface CheckboxGroupProps extends WithFormControlProps {
     size?: CheckboxSize;
     checkboxes: CheckboxProps[];
     direction?: FlexDirection;

package/build/components/Forms/Radio/components/RadioGroup/radioGroup.component.d.ts

@@ -1,6 +1,6 @@
+import React from 'react';
 import { RadioGroupProps as CRadioGroupProps, SystemProps } from '@chakra-ui/react';
 import { WithFormControlProps } from 'components/Forms/FormControl/formControl.component';
-import React from 'react';
 import { FlexDirection } from 'shared/types';
 import { RadioProps } from '../../radio.component';
 import { RadioSize } from '../../radio.types';

package/build/components/MediaAndIcons/Avatar/components/AvatarGroup/avatarGroup.component.d.ts

@@ -1,4 +1,5 @@
-import { AvatarProps, AvatarSize } from 'components/MediaAndIcons/Avatar';
+import { AvatarProps } from '../../avatar.component';
+import { AvatarSize } from '../../avatar.types';
 export interface AvatarGroupProps {
     avatars: AvatarProps[];
     max?: number;

package/build/index.js

@@ -1567,15 +1567,6 @@ var Icon = React.forwardRef(function (_a, ref) {
 });
 Icon.displayName = 'Icon';
 
-var AvatarGroup = function (_a) {
-    var avatars = _a.avatars, _b = _a.max, max = _b === void 0 ? 3 : _b, _c = _a.size, size = _c === void 0 ? 'md' : _c, handleAddButtonClick = _a.handleAddButtonClick, _d = _a.showAddButton, showAddButton = _d === void 0 ? true : _d, addButtonTooltipText = _a.addButtonTooltipText, _e = _a.showRemoveAvatarButton, showRemoveAvatarButton = _e === void 0 ? false : _e, handleRemoveButtonClick = _a.handleRemoveButtonClick;
-    var mergedNames = React.useMemo(function () { return avatars.map(function (avatar) { return avatar.name; }).join(', '); }, [avatars]);
-    var spacing = size === 'lg' || size === 'md' ? -2 : -1;
-    return (React__default["default"].createElement(react.AvatarGroup, { size: size, spacing: spacing },
-        avatars.length > max ? (React__default["default"].createElement(Avatar, { name: "".concat(avatars.length), size: size, variant: exports.AvatarVariant.Number, tooltipText: mergedNames })) : (avatars.map(function (avatar) { return (React__default["default"].createElement(Avatar, __assign({}, avatar, { key: avatar.name, size: size, showRemoveButton: showRemoveAvatarButton, handleRemoveButtonClick: handleRemoveButtonClick }))); })),
-        showAddButton && (React__default["default"].createElement(Avatar, { name: "", variant: exports.AvatarVariant.Dashed, icon: React__default["default"].createElement(Icon, { name: "plus", color: "subtle", size: size }), onClick: handleAddButtonClick, tooltipText: addButtonTooltipText, size: size }))));
-};
-
 var useAdaptiveColor = function (color) { return react.useColorModeValue(color.light, color.dark); };
 
 var camelCaseToLabel = function (s) {
@@ -1698,6 +1689,15 @@ var Avatar = function (_a) {
     return avatarMarkup;
 };
 
+var AvatarGroup = function (_a) {
+    var avatars = _a.avatars, _b = _a.max, max = _b === void 0 ? 3 : _b, _c = _a.size, size = _c === void 0 ? 'md' : _c, handleAddButtonClick = _a.handleAddButtonClick, _d = _a.showAddButton, showAddButton = _d === void 0 ? true : _d, addButtonTooltipText = _a.addButtonTooltipText, _e = _a.showRemoveAvatarButton, showRemoveAvatarButton = _e === void 0 ? false : _e, handleRemoveButtonClick = _a.handleRemoveButtonClick;
+    var mergedNames = React.useMemo(function () { return avatars.map(function (avatar) { return avatar.name; }).join(', '); }, [avatars]);
+    var spacing = size === 'lg' || size === 'md' ? -2 : -1;
+    return (React__default["default"].createElement(react.AvatarGroup, { size: size, spacing: spacing },
+        avatars.length > max ? (React__default["default"].createElement(Avatar, { name: "".concat(avatars.length), size: size, variant: exports.AvatarVariant.Number, tooltipText: mergedNames })) : (avatars.map(function (avatar) { return (React__default["default"].createElement(Avatar, __assign({}, avatar, { key: avatar.name, size: size, showRemoveButton: showRemoveAvatarButton, handleRemoveButtonClick: handleRemoveButtonClick }))); })),
+        showAddButton && (React__default["default"].createElement(Avatar, { name: "", variant: exports.AvatarVariant.Dashed, icon: React__default["default"].createElement(Icon, { name: "plus", color: "subtle", size: size }), onClick: handleAddButtonClick, tooltipText: addButtonTooltipText, size: size }))));
+};
+
 var AvatarConfig = {
     baseStyle: {
         container: {
@@ -3595,7 +3595,7 @@ function withFormControl(Component) {
         return (React__default["default"].createElement(react.FormControl, __assign({}, formControlStyle, { isInvalid: isInvalid, isRequired: isRequired, isReadOnly: isReadOnly, isDisabled: isDisabled }),
             label && (React__default["default"].createElement(react.FormLabel, __assign({ display: isFieldInline ? 'inline-block' : 'block', color: colors.text.light.default }, labelStyle), label)),
             React__default["default"].createElement(Component, __assign({}, props, { "$isFieldInline": isFieldInline, errorBorderColor: colors.border.light.error, focusBorderColor: colors.border.light.focus })),
-            React__default["default"].createElement(react.Flex, { mt: 2, w: "100%", justifyContent: alignment, alignItems: "center" },
+            React__default["default"].createElement(react.Flex, { mt: isInvalid || helperText ? 2 : 0, w: "100%", justifyContent: alignment, alignItems: "center" },
                 React__default["default"].createElement(react.FormErrorMessage, { m: 0, fontSize: fontSizes.xs, color: colors.text.light.error }, errorText),
                 helperText && (React__default["default"].createElement(react.FormHelperText, { color: isInvalid ? colors.text.light.error : colors.text.light.subtle, fontSize: fontSizes.xs }, helperText)))));
     }