@heathmont/moon-core-tw - npm Package Compare versions

Comparing version 9.3.1 to 9.4.0

lib/accordion/Accordion.d.ts

 /// <reference types="react" />
 import type AccordionProps from './private/types/AccordionProps';
-declare const Accordion: ({ title, openByDefault, children, disableOpen, headerContent, withButton, isContentInside, size, backgroundColor }: AccordionProps) => JSX.Element;
+declare const Accordion: ({ title, openByDefault, children, disableOpen, headerContent, withButton, isContentInside, size, bgColor, }: AccordionProps) => JSX.Element;
 export default Accordion;
 //# sourceMappingURL=Accordion.d.ts.map

lib/accordion/Accordion.js

@@ -32,3 +32,3 @@ "use strict";
 const setPadding_1 = __importDefault(require("./private/utils/setPadding"));
-const Accordion = ({ title, openByDefault, children, disableOpen, headerContent, withButton = true, isContentInside = true, size = 'md', backgroundColor = 'bg-gohan' }) => {
+const Accordion = ({ title, openByDefault, children, disableOpen, headerContent, withButton = true, isContentInside = true, size = 'md', bgColor = 'bg-gohan', }) => {
     const [isOpen, setIsOpen] = react_1.useState(openByDefault);
@@ -40,7 +40,7 @@ function handleState() {
     }
-    return (react_1.default.createElement("div", { className: classnames_1.default('w-full rounded-moon-s-sm h-max flex flex-col items-center', isContentInside ? backgroundColor : 'transparent', setPadding_1.default(isContentInside, size)) },
-        react_1.default.createElement("div", { className: classnames_1.default(backgroundColor, 'w-full flex items-center relative gap-1', disableOpen ? 'cursor-not-allowed' : 'cursor-pointer', isContentInside ? backgroundColor : 'transparent rounded-moon-s-sm', !isContentInside && setPadding_1.default(true, size)), onClick: handleState },
+    return (react_1.default.createElement("div", { className: classnames_1.default('w-full rounded-moon-s-sm h-max flex flex-col items-center', isContentInside ? bgColor : 'transparent', setPadding_1.default(isContentInside, size)) },
+        react_1.default.createElement("div", { className: classnames_1.default(bgColor, 'w-full flex items-center relative gap-1', disableOpen ? 'cursor-not-allowed' : 'cursor-pointer', isContentInside ? bgColor : 'transparent rounded-moon-s-sm', !isContentInside && setPadding_1.default(true, size)), onClick: handleState },
             title && (react_1.default.createElement("h3", { className: classnames_1.default('flex-1 font-medium text-bulma', setFont_1.default(size)) }, title)),
             headerContent && react_1.default.createElement(react_1.default.Fragment, null, headerContent),
-            withButton && (react_1.default.createElement("button", { type: "button", disabled: disableOpen, className: classnames_1.default('align-middle text-[0.5rem] leading-none no-underline text-trunks border-transparent', backgroundColor, disableOpen ? 'cursor-not-allowed' : 'cursor-pointer') },
+            withButton && (react_1.default.createElement("button", { type: "button", disabled: disableOpen, className: classnames_1.default('align-middle text-[0.5rem] leading-none no-underline text-trunks border-transparent', bgColor, disableOpen ? 'cursor-not-allowed' : 'cursor-pointer') },
                 react_1.default.createElement(moon_icons_tw_1.ControlsChevronRight, { className: classnames_1.default('text-trunks text-moon-24 transition-transform transition-200', setOpenIcon_1.default(isOpen)) })))),
@@ -47,0 +47,0 @@ react_1.default.createElement("div", { className: classnames_1.default('overflow-hidden w-full text-bulma', isOpen ? 'h-full' : 'h-0', isOpen && setMargin_1.default(size)) }, children)));

lib/accordion/private/types/AccordionProps.d.ts

 /// <reference types="react" />
-import AccordionSizes from './AccordionSizes';
+import type AccordionSizes from './AccordionSizes';
 declare type AccordionProps = {
@@ -12,6 +12,5 @@ title: string | React.ReactNode;
     isContentInside?: boolean;
-    isRtl?: boolean;
-    backgroundColor?: string;
+    bgColor?: string;
 };
 export default AccordionProps;
 //# sourceMappingURL=AccordionProps.d.ts.map

lib/accordion/private/utils/setOpenIcon.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const setOpenIcon = (isOpen) => {
-    return isOpen ? 'rotate-90' : 'rtl:rotate-180';
-};
+const setOpenIcon = (isOpen) => isOpen ? 'rotate-90' : 'rtl:rotate-180';
 exports.default = setOpenIcon;

lib/avatar/Avatar.js

@@ -12,7 +12,7 @@ "use strict";
 const Wrapper_1 = __importDefault(require("./styles/Wrapper"));
-const Avatar = ({ name, imageUrl = '', color = 'text-bulma', backgroundColor = 'bg-gohan', size = 'md', statusOrigin = { vertical: 'bottom', horizontal: 'right' }, isStatusActive, isRounded, }) => {
+const Avatar = ({ name, imageUrl = '', color = 'text-bulma', bgColor = 'bg-gohan', size = 'md', statusOrigin = { vertical: 'bottom', horizontal: 'right' }, isStatusActive, isRounded, }) => {
     return (react_1.default.createElement("div", { className: "relative" },
-        imageUrl ? (react_1.default.createElement(Wrapper_1.default, { size: size, imageUrl: imageUrl, color: color, backgroundColor: backgroundColor, isRounded: isRounded })) : (react_1.default.createElement(Wrapper_1.default, { size: size, imageUrl: imageUrl, color: color, backgroundColor: backgroundColor, isRounded: isRounded }, name || (react_1.default.createElement(moon_icons_tw_1.GenericUser, { className: classnames_1.default(setIconSize_1.default(size), color && color) })))),
+        imageUrl ? (react_1.default.createElement(Wrapper_1.default, { size: size, imageUrl: imageUrl, color: color, bgColor: bgColor, isRounded: isRounded })) : (react_1.default.createElement(Wrapper_1.default, { size: size, imageUrl: imageUrl, color: color, bgColor: bgColor, isRounded: isRounded }, name || (react_1.default.createElement(moon_icons_tw_1.GenericUser, { className: classnames_1.default(setIconSize_1.default(size), color && color) })))),
         statusOrigin && isStatusActive && (react_1.default.createElement(Status_1.default, { size: size, statusOrigin: statusOrigin }))));
 };
 exports.default = Avatar;

lib/avatar/private/types/AvatarProps.d.ts

@@ -8,3 +8,3 @@ /// <reference types="react" />
     color?: string;
-    backgroundColor?: string;
+    bgColor?: string;
     size?: SizeProps;
@@ -11,0 +11,0 @@ statusOrigin?: StatusOriginProps;

lib/avatar/styles/Status.js

@@ -9,9 +9,7 @@ "use strict";
 const setStatusSize_1 = __importDefault(require("../private/utils/setStatusSize"));
-const Status = ({ size, statusOrigin }) => {
-    return (react_1.default.createElement("div", { className: classnames_1.default('absolute border-solid border-beerus rounded-full bg-roshi', statusOrigin && statusOrigin.vertical === 'top' && 'top-0', statusOrigin && statusOrigin.vertical === 'bottom' && 'bottom-0', statusOrigin &&
-            statusOrigin.horizontal === 'left' &&
-            'ltr:left-0 rtl:right-0', statusOrigin &&
-            statusOrigin.horizontal === 'right' &&
-            'ltr:right-0 rtl:left-0', setStatusSize_1.default(size)) }));
-};
+const Status = ({ size, statusOrigin }) => (react_1.default.createElement("div", { className: classnames_1.default('absolute border-solid border-beerus rounded-full bg-roshi', statusOrigin && statusOrigin.vertical === 'top' && 'top-0', statusOrigin && statusOrigin.vertical === 'bottom' && 'bottom-0', statusOrigin &&
+        statusOrigin.horizontal === 'left' &&
+        'ltr:left-0 rtl:right-0', statusOrigin &&
+        statusOrigin.horizontal === 'right' &&
+        'ltr:right-0 rtl:left-0', setStatusSize_1.default(size)) }));
 exports.default = Status;

lib/avatar/styles/Wrapper.js

@@ -10,5 +10,3 @@ "use strict";
 const setWrapperSize_1 = __importDefault(require("../private/utils/setWrapperSize"));
-const Wrapper = ({ children, size, imageUrl, color, backgroundColor, isRounded, }) => {
-    return (react_1.default.createElement("div", { className: classnames_1.default('overflow-hidden uppercase font-medium flex items-center justify-center bg-cover', color && color, backgroundColor && backgroundColor, setWrapperSize_1.default(size), setBorderRadius_1.default(size, isRounded)), style: { backgroundImage: `url('${imageUrl}')` } }, children));
-};
+const Wrapper = ({ children, size, imageUrl, color, bgColor, isRounded, }) => (react_1.default.createElement("div", { className: classnames_1.default('overflow-hidden uppercase font-medium flex items-center justify-center bg-cover', color && color, bgColor && bgColor, setWrapperSize_1.default(size), setBorderRadius_1.default(size, isRounded)), style: { backgroundImage: `url('${imageUrl}')` } }, children));
 exports.default = Wrapper;

lib/breadcrumb/Breadcrumb.d.ts

 import React from 'react';
-import BreadcrumbProps from './private/types/BreadcrumbProps';
+import type BreadcrumbProps from './private/types/BreadcrumbProps';
 declare const Breadcrumb: React.FC<BreadcrumbProps>;
 export default Breadcrumb;
 //# sourceMappingURL=Breadcrumb.d.ts.map

lib/chip/private/types/ChipProps.d.ts

@@ -8,3 +8,2 @@ /// <reference types="react" />
     size?: 'sm' | 'md';
-    iconSize?: number;
     isStroke?: boolean;
@@ -11,0 +10,0 @@ variant?: 'default' | 'ghost';

lib/es/accordion/Accordion.d.ts

 /// <reference types="react" />
 import type AccordionProps from './private/types/AccordionProps';
-declare const Accordion: ({ title, openByDefault, children, disableOpen, headerContent, withButton, isContentInside, size, backgroundColor }: AccordionProps) => JSX.Element;
+declare const Accordion: ({ title, openByDefault, children, disableOpen, headerContent, withButton, isContentInside, size, bgColor, }: AccordionProps) => JSX.Element;
 export default Accordion;
 //# sourceMappingURL=Accordion.d.ts.map

lib/es/accordion/Accordion.js

@@ -8,3 +8,3 @@ import React, { useState } from 'react';
 import setPadding from './private/utils/setPadding';
-const Accordion = ({ title, openByDefault, children, disableOpen, headerContent, withButton = true, isContentInside = true, size = 'md', backgroundColor = 'bg-gohan' }) => {
+const Accordion = ({ title, openByDefault, children, disableOpen, headerContent, withButton = true, isContentInside = true, size = 'md', bgColor = 'bg-gohan', }) => {
     const [isOpen, setIsOpen] = useState(openByDefault);
@@ -16,7 +16,7 @@ function handleState() {
     }
-    return (React.createElement("div", { className: classNames('w-full rounded-moon-s-sm h-max flex flex-col items-center', isContentInside ? backgroundColor : 'transparent', setPadding(isContentInside, size)) },
-        React.createElement("div", { className: classNames(backgroundColor, 'w-full flex items-center relative gap-1', disableOpen ? 'cursor-not-allowed' : 'cursor-pointer', isContentInside ? backgroundColor : 'transparent rounded-moon-s-sm', !isContentInside && setPadding(true, size)), onClick: handleState },
+    return (React.createElement("div", { className: classNames('w-full rounded-moon-s-sm h-max flex flex-col items-center', isContentInside ? bgColor : 'transparent', setPadding(isContentInside, size)) },
+        React.createElement("div", { className: classNames(bgColor, 'w-full flex items-center relative gap-1', disableOpen ? 'cursor-not-allowed' : 'cursor-pointer', isContentInside ? bgColor : 'transparent rounded-moon-s-sm', !isContentInside && setPadding(true, size)), onClick: handleState },
             title && (React.createElement("h3", { className: classNames('flex-1 font-medium text-bulma', setFont(size)) }, title)),
             headerContent && React.createElement(React.Fragment, null, headerContent),
-            withButton && (React.createElement("button", { type: "button", disabled: disableOpen, className: classNames('align-middle text-[0.5rem] leading-none no-underline text-trunks border-transparent', backgroundColor, disableOpen ? 'cursor-not-allowed' : 'cursor-pointer') },
+            withButton && (React.createElement("button", { type: "button", disabled: disableOpen, className: classNames('align-middle text-[0.5rem] leading-none no-underline text-trunks border-transparent', bgColor, disableOpen ? 'cursor-not-allowed' : 'cursor-pointer') },
                 React.createElement(ControlsChevronRight, { className: classNames('text-trunks text-moon-24 transition-transform transition-200', setOpenIcon(isOpen)) })))),
@@ -23,0 +23,0 @@ React.createElement("div", { className: classNames('overflow-hidden w-full text-bulma', isOpen ? 'h-full' : 'h-0', isOpen && setMargin(size)) }, children)));

lib/es/accordion/private/types/AccordionProps.d.ts

 /// <reference types="react" />
-import AccordionSizes from './AccordionSizes';
+import type AccordionSizes from './AccordionSizes';
 declare type AccordionProps = {
@@ -12,6 +12,5 @@ title: string | React.ReactNode;
     isContentInside?: boolean;
-    isRtl?: boolean;
-    backgroundColor?: string;
+    bgColor?: string;
 };
 export default AccordionProps;
 //# sourceMappingURL=AccordionProps.d.ts.map

lib/es/accordion/private/utils/setOpenIcon.js

@@ -1,4 +0,2 @@
-const setOpenIcon = (isOpen) => {
-    return isOpen ? 'rotate-90' : 'rtl:rotate-180';
-};
+const setOpenIcon = (isOpen) => isOpen ? 'rotate-90' : 'rtl:rotate-180';
 export default setOpenIcon;

lib/es/avatar/Avatar.js

@@ -7,7 +7,7 @@ import React from 'react';
 import Wrapper from './styles/Wrapper';
-const Avatar = ({ name, imageUrl = '', color = 'text-bulma', backgroundColor = 'bg-gohan', size = 'md', statusOrigin = { vertical: 'bottom', horizontal: 'right' }, isStatusActive, isRounded, }) => {
+const Avatar = ({ name, imageUrl = '', color = 'text-bulma', bgColor = 'bg-gohan', size = 'md', statusOrigin = { vertical: 'bottom', horizontal: 'right' }, isStatusActive, isRounded, }) => {
     return (React.createElement("div", { className: "relative" },
-        imageUrl ? (React.createElement(Wrapper, { size: size, imageUrl: imageUrl, color: color, backgroundColor: backgroundColor, isRounded: isRounded })) : (React.createElement(Wrapper, { size: size, imageUrl: imageUrl, color: color, backgroundColor: backgroundColor, isRounded: isRounded }, name || (React.createElement(GenericUser, { className: classNames(setIconSize(size), color && color) })))),
+        imageUrl ? (React.createElement(Wrapper, { size: size, imageUrl: imageUrl, color: color, bgColor: bgColor, isRounded: isRounded })) : (React.createElement(Wrapper, { size: size, imageUrl: imageUrl, color: color, bgColor: bgColor, isRounded: isRounded }, name || (React.createElement(GenericUser, { className: classNames(setIconSize(size), color && color) })))),
         statusOrigin && isStatusActive && (React.createElement(Status, { size: size, statusOrigin: statusOrigin }))));
 };
 export default Avatar;

lib/es/avatar/private/types/AvatarProps.d.ts

@@ -8,3 +8,3 @@ /// <reference types="react" />
     color?: string;
-    backgroundColor?: string;
+    bgColor?: string;
     size?: SizeProps;
@@ -11,0 +11,0 @@ statusOrigin?: StatusOriginProps;

lib/es/avatar/styles/Status.js

 import React from 'react';
 import classNames from '../../private/utils/classnames';
 import setStatusSize from '../private/utils/setStatusSize';
-const Status = ({ size, statusOrigin }) => {
-    return (React.createElement("div", { className: classNames('absolute border-solid border-beerus rounded-full bg-roshi', statusOrigin && statusOrigin.vertical === 'top' && 'top-0', statusOrigin && statusOrigin.vertical === 'bottom' && 'bottom-0', statusOrigin &&
-            statusOrigin.horizontal === 'left' &&
-            'ltr:left-0 rtl:right-0', statusOrigin &&
-            statusOrigin.horizontal === 'right' &&
-            'ltr:right-0 rtl:left-0', setStatusSize(size)) }));
-};
+const Status = ({ size, statusOrigin }) => (React.createElement("div", { className: classNames('absolute border-solid border-beerus rounded-full bg-roshi', statusOrigin && statusOrigin.vertical === 'top' && 'top-0', statusOrigin && statusOrigin.vertical === 'bottom' && 'bottom-0', statusOrigin &&
+        statusOrigin.horizontal === 'left' &&
+        'ltr:left-0 rtl:right-0', statusOrigin &&
+        statusOrigin.horizontal === 'right' &&
+        'ltr:right-0 rtl:left-0', setStatusSize(size)) }));
 export default Status;

lib/es/avatar/styles/Wrapper.js

@@ -5,5 +5,3 @@ import React from 'react';
 import setWrapperSize from '../private/utils/setWrapperSize';
-const Wrapper = ({ children, size, imageUrl, color, backgroundColor, isRounded, }) => {
-    return (React.createElement("div", { className: classNames('overflow-hidden uppercase font-medium flex items-center justify-center bg-cover', color && color, backgroundColor && backgroundColor, setWrapperSize(size), setBorderRadius(size, isRounded)), style: { backgroundImage: `url('${imageUrl}')` } }, children));
-};
+const Wrapper = ({ children, size, imageUrl, color, bgColor, isRounded, }) => (React.createElement("div", { className: classNames('overflow-hidden uppercase font-medium flex items-center justify-center bg-cover', color && color, bgColor && bgColor, setWrapperSize(size), setBorderRadius(size, isRounded)), style: { backgroundImage: `url('${imageUrl}')` } }, children));
 export default Wrapper;

lib/es/breadcrumb/Breadcrumb.d.ts

 import React from 'react';
-import BreadcrumbProps from './private/types/BreadcrumbProps';
+import type BreadcrumbProps from './private/types/BreadcrumbProps';
 declare const Breadcrumb: React.FC<BreadcrumbProps>;
 export default Breadcrumb;
 //# sourceMappingURL=Breadcrumb.d.ts.map

lib/es/chip/private/types/ChipProps.d.ts

@@ -8,3 +8,2 @@ /// <reference types="react" />
     size?: 'sm' | 'md';
-    iconSize?: number;
     isStroke?: boolean;
@@ -11,0 +10,0 @@ variant?: 'default' | 'ghost';

lib/es/label/Label.js

 import React from 'react';
 import LabelContainer from './styles/LabelContainer';
-const Label = ({ children, color = 'text-gohan', backgroundColor = 'bg-bulma', iconLeft, iconRight, size = 'xs', isUppercase = true, }) => (React.createElement(LabelContainer, { backgroundColor: backgroundColor, color: color, size: size, isUppercase: isUppercase, iconLeft: iconLeft, iconRight: iconRight },
+const Label = ({ children, color = 'text-gohan', bgColor = 'bg-bulma', iconLeft, iconRight, size = 'xs', isUppercase = true, }) => (React.createElement(LabelContainer, { bgColor: bgColor, color: color, size: size, isUppercase: isUppercase, iconLeft: iconLeft, iconRight: iconRight },
     iconLeft && iconLeft,
@@ -5,0 +5,0 @@ children,

lib/es/label/private/types/LabelProps.d.ts

 /// <reference types="react" />
 declare type LabelProps = {
     color?: string;
-    backgroundColor?: string;
+    bgColor?: string;
     iconLeft?: React.ReactElement;
@@ -6,0 +6,0 @@ iconRight?: React.ReactElement;

lib/es/label/styles/LabelContainer.js

@@ -5,3 +5,3 @@ import React from 'react';
 import setSpacing from '../utils/setSpacing';
-const LabelContainer = ({ size, iconLeft, iconRight, isUppercase, color, backgroundColor, children, }) => (React.createElement("div", { className: classNames('flex items-center rounded-moon-i-xs gap-1', setSpacing({ size, iconRight, iconLeft }), setFontSize({ isUppercase, size }), color && color, backgroundColor && backgroundColor) }, children));
+const LabelContainer = ({ size, iconLeft, iconRight, isUppercase, color, bgColor, children, }) => (React.createElement("div", { className: classNames('flex items-center rounded-moon-i-xs gap-1', setSpacing({ size, iconRight, iconLeft }), setFontSize({ isUppercase, size }), color && color, bgColor && bgColor) }, children));
 export default LabelContainer;

lib/es/label/utils/setFontSize.d.ts

@@ -1,4 +0,4 @@
-import LabelProps from '../private/types/LabelProps';
+import type LabelProps from '../private/types/LabelProps';
 declare const setFontSize: ({ size, isUppercase }: LabelProps) => "text-moon-9-caption uppercase font-medium" | "text-moon-10-caption uppercase font-medium" | "text-moon-10" | "text-moon-12";
 export default setFontSize;
 //# sourceMappingURL=setFontSize.d.ts.map

lib/es/label/utils/setSpacing.d.ts

@@ -1,4 +0,4 @@
-import LabelProps from '../private/types/LabelProps';
+import type LabelProps from '../private/types/LabelProps';
 declare const setSpacing: ({ size, iconRight, iconLeft }: LabelProps) => "p-1" | "py-1 px-2" | "py-1 ps-1 pe-2" | "py-1 ps-2 pe-1" | "py-0 ps-0.5 pe-2" | "py-0 ps-2 pe-0.5" | "py-0 px-0.5" | "py-0 px-2";
 export default setSpacing;
 //# sourceMappingURL=setSpacing.d.ts.map

lib/es/radioButton/private/types/Props.d.ts

@@ -8,2 +8,3 @@ /// <reference types="react" />
     checked?: boolean;
+    readOnly?: boolean;
     onClick?: (event?: React.MouseEvent<HTMLInputElement>) => void;
@@ -10,0 +11,0 @@ onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;

lib/es/radioButton/RadioButton.d.ts

@@ -8,2 +8,3 @@ import React from 'react';
     checked?: boolean | undefined;
+    readOnly?: boolean | undefined;
     onClick?: ((event?: React.MouseEvent<HTMLInputElement, MouseEvent> | undefined) => void) | undefined;
@@ -10,0 +11,0 @@ onChange?: ((event: React.ChangeEvent<HTMLInputElement>) => void) | undefined;

lib/es/textInput/private/Container.js

 import React from 'react';
 import classNames from '../../private/utils/classnames';
-import getBorderRadius from '../private/utils/getBorderRadius';
+import getBorderRadius from './utils/getBorderRadius';
 const Container = ({ children, disabled, inputSize, }) => (React.createElement("div", { className: classNames('w-full max-w-full relative z-0', disabled && 'opacity-30 cursor-not-allowed', getBorderRadius(inputSize)) }, children));
 export default Container;

lib/es/textInput/private/HintText.js

 import React from 'react';
 import classNames from '../../private/utils/classnames';
-const HintText = ({ children, isError }) => (React.createElement("p", { role: "alert", className: classNames('inline-block mt-2 text-moon-12', isError ? 'text-chiChi' : 'text-trunks') }, children));
+const HintText = ({ children, isError }) => (React.createElement("p", { role: "alert", className: classNames('inline-block mt-2 ps-4 text-moon-12', isError ? 'text-chiChi' : 'text-trunks') }, children));
 export default HintText;

lib/es/textInput/private/Input.d.ts

 import React from 'react';
-import TextInputProps from '../private/types/TextInputProps';
+import type TextInputProps from '../private/types/TextInputProps';
 declare const Input: React.ForwardRefExoticComponent<TextInputProps & {
@@ -4,0 +4,0 @@ isLabel?: boolean | undefined;

lib/es/textInput/private/Input.js

@@ -17,6 +17,6 @@ var __rest = (this && this.__rest) || function (s, e) {
 const Input = forwardRef((props, ref) => {
-    const { backgroundColor, inputSize, isError, type, placeholder, isLabel, isRtl, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, isFirst, isPassword } = props, rest = __rest(props, ["backgroundColor", "inputSize", "isError", "type", "placeholder", "isLabel", "isRtl", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "isFirst", "isPassword"]);
+    const { bgColor, inputSize = 'md', isError, type = 'text', placeholder = '', isLabel, isRtl, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, isFirst, isPassword } = props, rest = __rest(props, ["bgColor", "inputSize", "isError", "type", "placeholder", "isLabel", "isRtl", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "isFirst", "isPassword"]);
     return (React.createElement(React.Fragment, null,
         React.createElement("input", Object.assign({ ref: ref, type: type, placeholder: placeholder, className: classNames('block w-full max-w-full py-0 px-4 m-0 appearance-none text-[1rem] text-bulma transition-shadow box-border relative z-[2]', 'shadow-input hover:shadow-input-hov', 'focus:shadow-input-focus focus:outline-none', isError &&
-                'shadow-input-err hover:shadow-input-err focus:shadow-input-err', !backgroundColor ? 'bg-transparent' : backgroundColor, getSizeStyles(inputSize), 'before:box-border after:box-border', 'placeholder:text-trunks placeholder:opacity-100 placeholder:transition-opacity placeholder:delay-75', 'read-only:outline-0 read-only:border-none read-only:cursor-not-allowed read-only:hover:shadow-input read-only:focus:shadow-input', type === 'number' && 'input-number-clear', type === 'date' && 'input-d', type === 'date' && isRtl && 'input-d-rtl', type === 'time' && 'input-t', type === 'time' && isRtl && 'input-t-rtl', type === 'datetime-local' && 'input-d', type === 'datetime-local' && isRtl && 'input-dt-local-rtl', inputSize === 'xl' && 'input-xl-dt-shared', inputSize === 'xl' &&
+                'shadow-input-err hover:shadow-input-err focus:shadow-input-err', !bgColor ? 'bg-transparent' : bgColor, getSizeStyles(inputSize), 'before:box-border after:box-border', 'placeholder:text-trunks placeholder:opacity-100 placeholder:transition-opacity placeholder:delay-75', 'read-only:outline-0 read-only:border-none read-only:cursor-not-allowed read-only:hover:shadow-input read-only:focus:shadow-input', type === 'number' && 'input-number-clear', type === 'date' && 'input-d', type === 'date' && isRtl && 'input-d-rtl', type === 'time' && 'input-t', type === 'time' && isRtl && 'input-t-rtl', type === 'datetime-local' && 'input-d', type === 'datetime-local' && isRtl && 'input-dt-local-rtl', inputSize === 'xl' && 'input-xl-dt-shared', inputSize === 'xl' &&
                 isLabel &&
@@ -23,0 +23,0 @@ 'input-xl pt-[1.125rem] input-xl-dt-label', inputSize === 'lg' && 'input-lg-dt-shared', 'input-dt-shared', (isSharpLeftSide || isSharpTopSide) && !isError && 'rounded-tl-none', (isSharpRightSide || isSharpTopSide) && !isError && 'rounded-tr-none', (isSharpLeftSide || isSharpBottomSide) &&

lib/es/textInput/private/ShowPassword.js

 import React from 'react';
 import classNames from '../../private/utils/classnames';
-const ShowPassword = ({ children, isRtl, onClick, }) => (React.createElement("div", { onClick: onClick, role: "alert", className: classNames('text-moon-14 text-bulma absolute top-2/4 mt-[-0.75rem] z-[3] underline cursor-pointer', isRtl ? 'left-[0.938rem]' : 'right-[0.938rem]') }, children));
+const ShowPassword = ({ children, isRtl, onClick, }) => (React.createElement("div", { onClick: onClick, role: "alert", className: classNames('text-moon-14 text-bulma absolute top-2/4 mt-[-0.75rem] z-[3] underline cursor-pointer', isRtl ? 'left-4' : 'right-4') }, children));
 export default ShowPassword;

lib/es/textInput/private/TextInputBasic.d.ts

 import React from 'react';
-import TextInputProps from '../private/types/TextInputProps';
+import type TextInputProps from '../private/types/TextInputProps';
 declare const TextInputBasic: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;
 export default TextInputBasic;
 //# sourceMappingURL=TextInputBasic.d.ts.map

lib/es/textInput/private/TextInputBasic.js

@@ -18,3 +18,3 @@ var __rest = (this && this.__rest) || function (s, e) {
 const TextInputBasic = forwardRef((props, ref) => {
-    const { id, inputSize = 'md', type, disabled, placeholder = ' ', label, hintText, isError, dir, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, backgroundColor = 'bg-gohan' } = props, rest = __rest(props, ["id", "inputSize", "type", "disabled", "placeholder", "label", "hintText", "isError", "dir", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "backgroundColor"]);
+    const { id, inputSize, type, disabled, placeholder, label, hintText, isError, dir, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, bgColor = 'bg-gohan' } = props, rest = __rest(props, ["id", "inputSize", "type", "disabled", "placeholder", "label", "hintText", "isError", "dir", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "bgColor"]);
     const inputProps = Object.assign({ disabled,
@@ -32,5 +32,5 @@ type,
         label && (React.createElement("label", { dir: dir, htmlFor: id, className: classNames('block text-moon-16 text-bulma pb-2', disabled && 'opacity-30 cursor-not-allowed') }, label)),
-        React.createElement(Input, Object.assign({ inputSize: inputSize, isError: isError, ref: ref, id: id, backgroundColor: backgroundColor, isRtl: dir === 'rtl' }, inputProps)),
+        React.createElement(Input, Object.assign({ inputSize: inputSize, isError: isError, ref: ref, id: id, bgColor: bgColor, isRtl: dir === 'rtl' }, inputProps)),
         hintText && React.createElement(HintText, { isError: isError }, hintText)));
 });
 export default TextInputBasic;

lib/es/textInput/private/TextInputInnerLabel.d.ts

 import React from 'react';
-import TextInputProps from '../private/types/TextInputProps';
+import type TextInputProps from '../private/types/TextInputProps';
 declare const TextInputInnerLabel: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;
 export default TextInputInnerLabel;
 //# sourceMappingURL=TextInputInnerLabel.d.ts.map

lib/es/textInput/private/TextInputInnerLabel.js

@@ -14,8 +14,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 import classNames from '../../private/utils/classnames';
-import getBorderRadius from '../private/utils/getBorderRadius';
 import Container from './Container';
 import HintText from './HintText';
 import Input from './Input';
+import getBorderRadius from './utils/getBorderRadius';
 const TextInputInnerLabel = forwardRef((props, ref) => {
-    const { id, inputSize = 'md', type, disabled, placeholder = ' ', label, hintText, isError, dir, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, backgroundColor = 'bg-gohan' } = props, rest = __rest(props, ["id", "inputSize", "type", "disabled", "placeholder", "label", "hintText", "isError", "dir", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "backgroundColor"]);
+    const { id, inputSize, type, disabled, placeholder, label, hintText, isError, dir, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, bgColor = 'bg-gohan' } = props, rest = __rest(props, ["id", "inputSize", "type", "disabled", "placeholder", "label", "hintText", "isError", "dir", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "bgColor"]);
     const inputProps = Object.assign({ disabled,
@@ -32,3 +32,3 @@ type,
     return (React.createElement(Container, { disabled: disabled, inputSize: inputSize },
-        React.createElement("div", { className: classNames('w-full max-w-full relative ', !backgroundColor ? 'bg-transparent' : backgroundColor, getBorderRadius(inputSize)) },
+        React.createElement("div", { className: classNames('w-full max-w-full relative ', !bgColor ? 'bg-transparent' : bgColor, getBorderRadius(inputSize)) },
             React.createElement(Input, Object.assign({ inputSize: inputSize, isError: isError, ref: ref, id: id, isLabel: !!label, isRtl: dir === 'rtl' }, inputProps)),
@@ -35,0 +35,0 @@ React.createElement("label", { className: classNames('absolute text-[0.75rem] leading-3 text-trunks top-3 z-[1] transition-all ease-in-out duration-200', dir === 'rtl' ? 'right-4' : 'left-4') }, label)),

lib/es/textInput/private/TextInputPassword.d.ts

 import React from 'react';
-import TextInputProps from '../private/types/TextInputProps';
+import type TextInputProps from '../private/types/TextInputProps';
 declare const TextInputPassword: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;
 export default TextInputPassword;
 //# sourceMappingURL=TextInputPassword.d.ts.map

lib/es/textInput/private/TextInputPassword.js

@@ -14,3 +14,2 @@ var __rest = (this && this.__rest) || function (s, e) {
 import classNames from '../../private/utils/classnames';
-import getBorderRadius from '../private/utils/getBorderRadius';
 import Container from './Container';
@@ -20,4 +19,5 @@ import HintText from './HintText';
 import ShowPassword from './ShowPassword';
+import getBorderRadius from './utils/getBorderRadius';
 const TextInputPassword = forwardRef((props, ref) => {
-    const { id, inputSize = 'md', type, disabled, placeholder = ' ', label, hintText, isError, dir, showPasswordText, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, backgroundColor = 'bg-gohan' } = props, rest = __rest(props, ["id", "inputSize", "type", "disabled", "placeholder", "label", "hintText", "isError", "dir", "showPasswordText", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "backgroundColor"]);
+    const { id, inputSize, type, disabled, placeholder, label, hintText, isError, dir, showPasswordText, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, bgColor = 'bg-gohan' } = props, rest = __rest(props, ["id", "inputSize", "type", "disabled", "placeholder", "label", "hintText", "isError", "dir", "showPasswordText", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "bgColor"]);
     const [passwordShown, setPasswordShown] = React.useState(false);
@@ -38,3 +38,3 @@ const togglePasswordVisiblity = () => {
         return (React.createElement(Container, { disabled: disabled },
-            React.createElement("div", { className: classNames('w-full max-w-full relative ', getBorderRadius(inputSize), backgroundColor && backgroundColor) },
+            React.createElement("div", { className: classNames('w-full max-w-full relative ', getBorderRadius(inputSize), bgColor && bgColor) },
                 React.createElement(Input, Object.assign({ inputSize: inputSize, type: passwordShown ? 'text' : 'password', isError: isError, ref: ref, id: id, isLabel: !!label, isPassword: true }, inputProps)),
@@ -48,3 +48,3 @@ React.createElement("label", { className: classNames('absolute text-[0.75rem] leading-3 text-trunks top-3 z-[1] transition-all', dir === 'rtl' ? 'right-4' : 'left-4') }, label),
         React.createElement("div", { className: classNames('w-full max-w-full relative ', getBorderRadius(inputSize)) },
-            React.createElement(Input, Object.assign({ inputSize: inputSize, type: passwordShown ? 'text' : 'password', isError: isError, ref: ref, id: id, backgroundColor: backgroundColor, isPassword: true }, inputProps)),
+            React.createElement(Input, Object.assign({ inputSize: inputSize, type: passwordShown ? 'text' : 'password', isError: isError, ref: ref, id: id, bgColor: bgColor, isPassword: true }, inputProps)),
             React.createElement(ShowPassword, { onClick: togglePasswordVisiblity, isRtl: dir === 'rtl' }, showPasswordText)),
@@ -51,0 +51,0 @@ hintText && React.createElement(HintText, { isError: isError }, hintText)));

lib/es/textInput/private/types/TextInputProps.d.ts

 /// <reference types="react" />
-import TextInputTypes from './TextInputTypes';
+import type TextInputTypes from './TextInputTypes';
 export default interface TextInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
     id?: string;
     inputSize?: 'md' | 'lg' | 'xl';
-    type: TextInputTypes | string;
+    type?: TextInputTypes | string;
     label?: JSX.Element | string;
@@ -13,3 +13,3 @@ placeholder?: string;
     showPasswordText?: JSX.Element | string;
-    backgroundColor?: string;
+    bgColor?: string;
     isSharpLeftSide?: boolean;
@@ -16,0 +16,0 @@ isSharpRightSide?: boolean;

lib/es/textInput/private/utils/getBorderRadius.js

@@ -1,11 +0,2 @@
-const getBorderRadius = (size) => {
-    switch (size) {
-        case 'xl':
-            return 'rounded-moon-i-md';
-        case 'lg':
-            return 'rounded-moon-i-sm';
-        default:
-            return 'rounded-moon-i-sm';
-    }
-};
+const getBorderRadius = (size) => size === 'xl' ? 'rounded-moon-i-md' : 'rounded-moon-i-sm';
 export default getBorderRadius;

lib/es/textInput/TextInput.d.ts

 import React from 'react';
-import TextInputProps from './private/types/TextInputProps';
+import type TextInputProps from './private/types/TextInputProps';
 declare const TextInput: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;
 export default TextInput;
 //# sourceMappingURL=TextInput.d.ts.map

lib/es/textInput/TextInput.js

 import React, { forwardRef } from 'react';
-import Size from '../private/enums/Size';
 import TextInputBasic from './private/TextInputBasic';
@@ -7,3 +6,3 @@ import TextInputInnerLabel from './private/TextInputInnerLabel';
 const TextInput = forwardRef((props, ref) => {
-    const { inputSize = Size.md, type } = props;
+    const { inputSize = 'md', type } = props;
     //render input with show/hide password
@@ -10,0 +9,0 @@ if (type === 'password') {

lib/label/Label.js

@@ -8,3 +8,3 @@ "use strict";
 const LabelContainer_1 = __importDefault(require("./styles/LabelContainer"));
-const Label = ({ children, color = 'text-gohan', backgroundColor = 'bg-bulma', iconLeft, iconRight, size = 'xs', isUppercase = true, }) => (react_1.default.createElement(LabelContainer_1.default, { backgroundColor: backgroundColor, color: color, size: size, isUppercase: isUppercase, iconLeft: iconLeft, iconRight: iconRight },
+const Label = ({ children, color = 'text-gohan', bgColor = 'bg-bulma', iconLeft, iconRight, size = 'xs', isUppercase = true, }) => (react_1.default.createElement(LabelContainer_1.default, { bgColor: bgColor, color: color, size: size, isUppercase: isUppercase, iconLeft: iconLeft, iconRight: iconRight },
     iconLeft && iconLeft,
@@ -11,0 +11,0 @@ children,

lib/label/private/types/LabelProps.d.ts

 /// <reference types="react" />
 declare type LabelProps = {
     color?: string;
-    backgroundColor?: string;
+    bgColor?: string;
     iconLeft?: React.ReactElement;
@@ -6,0 +6,0 @@ iconRight?: React.ReactElement;

lib/label/styles/LabelContainer.js

@@ -10,3 +10,3 @@ "use strict";
 const setSpacing_1 = __importDefault(require("../utils/setSpacing"));
-const LabelContainer = ({ size, iconLeft, iconRight, isUppercase, color, backgroundColor, children, }) => (react_1.default.createElement("div", { className: classnames_1.default('flex items-center rounded-moon-i-xs gap-1', setSpacing_1.default({ size, iconRight, iconLeft }), setFontSize_1.default({ isUppercase, size }), color && color, backgroundColor && backgroundColor) }, children));
+const LabelContainer = ({ size, iconLeft, iconRight, isUppercase, color, bgColor, children, }) => (react_1.default.createElement("div", { className: classnames_1.default('flex items-center rounded-moon-i-xs gap-1', setSpacing_1.default({ size, iconRight, iconLeft }), setFontSize_1.default({ isUppercase, size }), color && color, bgColor && bgColor) }, children));
 exports.default = LabelContainer;

lib/label/utils/setFontSize.d.ts

@@ -1,4 +0,4 @@
-import LabelProps from '../private/types/LabelProps';
+import type LabelProps from '../private/types/LabelProps';
 declare const setFontSize: ({ size, isUppercase }: LabelProps) => "text-moon-9-caption uppercase font-medium" | "text-moon-10-caption uppercase font-medium" | "text-moon-10" | "text-moon-12";
 export default setFontSize;
 //# sourceMappingURL=setFontSize.d.ts.map

lib/label/utils/setSpacing.d.ts

@@ -1,4 +0,4 @@
-import LabelProps from '../private/types/LabelProps';
+import type LabelProps from '../private/types/LabelProps';
 declare const setSpacing: ({ size, iconRight, iconLeft }: LabelProps) => "p-1" | "py-1 px-2" | "py-1 ps-1 pe-2" | "py-1 ps-2 pe-1" | "py-0 ps-0.5 pe-2" | "py-0 ps-2 pe-0.5" | "py-0 px-0.5" | "py-0 px-2";
 export default setSpacing;
 //# sourceMappingURL=setSpacing.d.ts.map

lib/radioButton/private/types/Props.d.ts

@@ -8,2 +8,3 @@ /// <reference types="react" />
     checked?: boolean;
+    readOnly?: boolean;
     onClick?: (event?: React.MouseEvent<HTMLInputElement>) => void;
@@ -10,0 +11,0 @@ onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;

lib/radioButton/RadioButton.d.ts

@@ -8,2 +8,3 @@ import React from 'react';
     checked?: boolean | undefined;
+    readOnly?: boolean | undefined;
     onClick?: ((event?: React.MouseEvent<HTMLInputElement, MouseEvent> | undefined) => void) | undefined;
@@ -10,0 +11,0 @@ onChange?: ((event: React.ChangeEvent<HTMLInputElement>) => void) | undefined;

lib/textInput/private/Container.js

@@ -8,4 +8,4 @@ "use strict";
 const classnames_1 = __importDefault(require("../../private/utils/classnames"));
-const getBorderRadius_1 = __importDefault(require("../private/utils/getBorderRadius"));
+const getBorderRadius_1 = __importDefault(require("./utils/getBorderRadius"));
 const Container = ({ children, disabled, inputSize, }) => (react_1.default.createElement("div", { className: classnames_1.default('w-full max-w-full relative z-0', disabled && 'opacity-30 cursor-not-allowed', getBorderRadius_1.default(inputSize)) }, children));
 exports.default = Container;

lib/textInput/private/HintText.js

@@ -8,3 +8,3 @@ "use strict";
 const classnames_1 = __importDefault(require("../../private/utils/classnames"));
-const HintText = ({ children, isError }) => (react_1.default.createElement("p", { role: "alert", className: classnames_1.default('inline-block mt-2 text-moon-12', isError ? 'text-chiChi' : 'text-trunks') }, children));
+const HintText = ({ children, isError }) => (react_1.default.createElement("p", { role: "alert", className: classnames_1.default('inline-block mt-2 ps-4 text-moon-12', isError ? 'text-chiChi' : 'text-trunks') }, children));
 exports.default = HintText;

lib/textInput/private/Input.d.ts

 import React from 'react';
-import TextInputProps from '../private/types/TextInputProps';
+import type TextInputProps from '../private/types/TextInputProps';
 declare const Input: React.ForwardRefExoticComponent<TextInputProps & {
@@ -4,0 +4,0 @@ isLabel?: boolean | undefined;

lib/textInput/private/Input.js

@@ -41,6 +41,6 @@ "use strict";
 const Input = react_1.forwardRef((props, ref) => {
-    const { backgroundColor, inputSize, isError, type, placeholder, isLabel, isRtl, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, isFirst, isPassword } = props, rest = __rest(props, ["backgroundColor", "inputSize", "isError", "type", "placeholder", "isLabel", "isRtl", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "isFirst", "isPassword"]);
+    const { bgColor, inputSize = 'md', isError, type = 'text', placeholder = '', isLabel, isRtl, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, isFirst, isPassword } = props, rest = __rest(props, ["bgColor", "inputSize", "isError", "type", "placeholder", "isLabel", "isRtl", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "isFirst", "isPassword"]);
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement("input", Object.assign({ ref: ref, type: type, placeholder: placeholder, className: classnames_1.default('block w-full max-w-full py-0 px-4 m-0 appearance-none text-[1rem] text-bulma transition-shadow box-border relative z-[2]', 'shadow-input hover:shadow-input-hov', 'focus:shadow-input-focus focus:outline-none', isError &&
-                'shadow-input-err hover:shadow-input-err focus:shadow-input-err', !backgroundColor ? 'bg-transparent' : backgroundColor, getSizeStyles_1.default(inputSize), 'before:box-border after:box-border', 'placeholder:text-trunks placeholder:opacity-100 placeholder:transition-opacity placeholder:delay-75', 'read-only:outline-0 read-only:border-none read-only:cursor-not-allowed read-only:hover:shadow-input read-only:focus:shadow-input', type === 'number' && 'input-number-clear', type === 'date' && 'input-d', type === 'date' && isRtl && 'input-d-rtl', type === 'time' && 'input-t', type === 'time' && isRtl && 'input-t-rtl', type === 'datetime-local' && 'input-d', type === 'datetime-local' && isRtl && 'input-dt-local-rtl', inputSize === 'xl' && 'input-xl-dt-shared', inputSize === 'xl' &&
+                'shadow-input-err hover:shadow-input-err focus:shadow-input-err', !bgColor ? 'bg-transparent' : bgColor, getSizeStyles_1.default(inputSize), 'before:box-border after:box-border', 'placeholder:text-trunks placeholder:opacity-100 placeholder:transition-opacity placeholder:delay-75', 'read-only:outline-0 read-only:border-none read-only:cursor-not-allowed read-only:hover:shadow-input read-only:focus:shadow-input', type === 'number' && 'input-number-clear', type === 'date' && 'input-d', type === 'date' && isRtl && 'input-d-rtl', type === 'time' && 'input-t', type === 'time' && isRtl && 'input-t-rtl', type === 'datetime-local' && 'input-d', type === 'datetime-local' && isRtl && 'input-dt-local-rtl', inputSize === 'xl' && 'input-xl-dt-shared', inputSize === 'xl' &&
                 isLabel &&
@@ -47,0 +47,0 @@ 'input-xl pt-[1.125rem] input-xl-dt-label', inputSize === 'lg' && 'input-lg-dt-shared', 'input-dt-shared', (isSharpLeftSide || isSharpTopSide) && !isError && 'rounded-tl-none', (isSharpRightSide || isSharpTopSide) && !isError && 'rounded-tr-none', (isSharpLeftSide || isSharpBottomSide) &&

lib/textInput/private/ShowPassword.js

@@ -8,3 +8,3 @@ "use strict";
 const classnames_1 = __importDefault(require("../../private/utils/classnames"));
-const ShowPassword = ({ children, isRtl, onClick, }) => (react_1.default.createElement("div", { onClick: onClick, role: "alert", className: classnames_1.default('text-moon-14 text-bulma absolute top-2/4 mt-[-0.75rem] z-[3] underline cursor-pointer', isRtl ? 'left-[0.938rem]' : 'right-[0.938rem]') }, children));
+const ShowPassword = ({ children, isRtl, onClick, }) => (react_1.default.createElement("div", { onClick: onClick, role: "alert", className: classnames_1.default('text-moon-14 text-bulma absolute top-2/4 mt-[-0.75rem] z-[3] underline cursor-pointer', isRtl ? 'left-4' : 'right-4') }, children));
 exports.default = ShowPassword;

lib/textInput/private/TextInputBasic.d.ts

 import React from 'react';
-import TextInputProps from '../private/types/TextInputProps';
+import type TextInputProps from '../private/types/TextInputProps';
 declare const TextInputBasic: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;
 export default TextInputBasic;
 //# sourceMappingURL=TextInputBasic.d.ts.map

lib/textInput/private/TextInputBasic.js

@@ -42,3 +42,3 @@ "use strict";
 const TextInputBasic = react_1.forwardRef((props, ref) => {
-    const { id, inputSize = 'md', type, disabled, placeholder = ' ', label, hintText, isError, dir, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, backgroundColor = 'bg-gohan' } = props, rest = __rest(props, ["id", "inputSize", "type", "disabled", "placeholder", "label", "hintText", "isError", "dir", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "backgroundColor"]);
+    const { id, inputSize, type, disabled, placeholder, label, hintText, isError, dir, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, bgColor = 'bg-gohan' } = props, rest = __rest(props, ["id", "inputSize", "type", "disabled", "placeholder", "label", "hintText", "isError", "dir", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "bgColor"]);
     const inputProps = Object.assign({ disabled,
@@ -56,5 +56,5 @@ type,
         label && (react_1.default.createElement("label", { dir: dir, htmlFor: id, className: classnames_1.default('block text-moon-16 text-bulma pb-2', disabled && 'opacity-30 cursor-not-allowed') }, label)),
-        react_1.default.createElement(Input_1.default, Object.assign({ inputSize: inputSize, isError: isError, ref: ref, id: id, backgroundColor: backgroundColor, isRtl: dir === 'rtl' }, inputProps)),
+        react_1.default.createElement(Input_1.default, Object.assign({ inputSize: inputSize, isError: isError, ref: ref, id: id, bgColor: bgColor, isRtl: dir === 'rtl' }, inputProps)),
         hintText && react_1.default.createElement(HintText_1.default, { isError: isError }, hintText)));
 });
 exports.default = TextInputBasic;

lib/textInput/private/TextInputInnerLabel.d.ts

 import React from 'react';
-import TextInputProps from '../private/types/TextInputProps';
+import type TextInputProps from '../private/types/TextInputProps';
 declare const TextInputInnerLabel: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;
 export default TextInputInnerLabel;
 //# sourceMappingURL=TextInputInnerLabel.d.ts.map

lib/textInput/private/TextInputInnerLabel.js

@@ -38,8 +38,8 @@ "use strict";
 const classnames_1 = __importDefault(require("../../private/utils/classnames"));
-const getBorderRadius_1 = __importDefault(require("../private/utils/getBorderRadius"));
 const Container_1 = __importDefault(require("./Container"));
 const HintText_1 = __importDefault(require("./HintText"));
 const Input_1 = __importDefault(require("./Input"));
+const getBorderRadius_1 = __importDefault(require("./utils/getBorderRadius"));
 const TextInputInnerLabel = react_1.forwardRef((props, ref) => {
-    const { id, inputSize = 'md', type, disabled, placeholder = ' ', label, hintText, isError, dir, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, backgroundColor = 'bg-gohan' } = props, rest = __rest(props, ["id", "inputSize", "type", "disabled", "placeholder", "label", "hintText", "isError", "dir", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "backgroundColor"]);
+    const { id, inputSize, type, disabled, placeholder, label, hintText, isError, dir, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, bgColor = 'bg-gohan' } = props, rest = __rest(props, ["id", "inputSize", "type", "disabled", "placeholder", "label", "hintText", "isError", "dir", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "bgColor"]);
     const inputProps = Object.assign({ disabled,
@@ -56,3 +56,3 @@ type,
     return (react_1.default.createElement(Container_1.default, { disabled: disabled, inputSize: inputSize },
-        react_1.default.createElement("div", { className: classnames_1.default('w-full max-w-full relative ', !backgroundColor ? 'bg-transparent' : backgroundColor, getBorderRadius_1.default(inputSize)) },
+        react_1.default.createElement("div", { className: classnames_1.default('w-full max-w-full relative ', !bgColor ? 'bg-transparent' : bgColor, getBorderRadius_1.default(inputSize)) },
             react_1.default.createElement(Input_1.default, Object.assign({ inputSize: inputSize, isError: isError, ref: ref, id: id, isLabel: !!label, isRtl: dir === 'rtl' }, inputProps)),
@@ -59,0 +59,0 @@ react_1.default.createElement("label", { className: classnames_1.default('absolute text-[0.75rem] leading-3 text-trunks top-3 z-[1] transition-all ease-in-out duration-200', dir === 'rtl' ? 'right-4' : 'left-4') }, label)),

lib/textInput/private/TextInputPassword.d.ts

 import React from 'react';
-import TextInputProps from '../private/types/TextInputProps';
+import type TextInputProps from '../private/types/TextInputProps';
 declare const TextInputPassword: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;
 export default TextInputPassword;
 //# sourceMappingURL=TextInputPassword.d.ts.map

lib/textInput/private/TextInputPassword.js

@@ -38,3 +38,2 @@ "use strict";
 const classnames_1 = __importDefault(require("../../private/utils/classnames"));
-const getBorderRadius_1 = __importDefault(require("../private/utils/getBorderRadius"));
 const Container_1 = __importDefault(require("./Container"));
@@ -44,4 +43,5 @@ const HintText_1 = __importDefault(require("./HintText"));
 const ShowPassword_1 = __importDefault(require("./ShowPassword"));
+const getBorderRadius_1 = __importDefault(require("./utils/getBorderRadius"));
 const TextInputPassword = react_1.forwardRef((props, ref) => {
-    const { id, inputSize = 'md', type, disabled, placeholder = ' ', label, hintText, isError, dir, showPasswordText, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, backgroundColor = 'bg-gohan' } = props, rest = __rest(props, ["id", "inputSize", "type", "disabled", "placeholder", "label", "hintText", "isError", "dir", "showPasswordText", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "backgroundColor"]);
+    const { id, inputSize, type, disabled, placeholder, label, hintText, isError, dir, showPasswordText, isSharpLeftSide, isSharpRightSide, isSharpTopSide, isSharpBottomSide, isTopBottomBorderHidden, isSideBorderHidden, bgColor = 'bg-gohan' } = props, rest = __rest(props, ["id", "inputSize", "type", "disabled", "placeholder", "label", "hintText", "isError", "dir", "showPasswordText", "isSharpLeftSide", "isSharpRightSide", "isSharpTopSide", "isSharpBottomSide", "isTopBottomBorderHidden", "isSideBorderHidden", "bgColor"]);
     const [passwordShown, setPasswordShown] = react_1.default.useState(false);
@@ -62,3 +62,3 @@ const togglePasswordVisiblity = () => {
         return (react_1.default.createElement(Container_1.default, { disabled: disabled },
-            react_1.default.createElement("div", { className: classnames_1.default('w-full max-w-full relative ', getBorderRadius_1.default(inputSize), backgroundColor && backgroundColor) },
+            react_1.default.createElement("div", { className: classnames_1.default('w-full max-w-full relative ', getBorderRadius_1.default(inputSize), bgColor && bgColor) },
                 react_1.default.createElement(Input_1.default, Object.assign({ inputSize: inputSize, type: passwordShown ? 'text' : 'password', isError: isError, ref: ref, id: id, isLabel: !!label, isPassword: true }, inputProps)),
@@ -72,3 +72,3 @@ react_1.default.createElement("label", { className: classnames_1.default('absolute text-[0.75rem] leading-3 text-trunks top-3 z-[1] transition-all', dir === 'rtl' ? 'right-4' : 'left-4') }, label),
         react_1.default.createElement("div", { className: classnames_1.default('w-full max-w-full relative ', getBorderRadius_1.default(inputSize)) },
-            react_1.default.createElement(Input_1.default, Object.assign({ inputSize: inputSize, type: passwordShown ? 'text' : 'password', isError: isError, ref: ref, id: id, backgroundColor: backgroundColor, isPassword: true }, inputProps)),
+            react_1.default.createElement(Input_1.default, Object.assign({ inputSize: inputSize, type: passwordShown ? 'text' : 'password', isError: isError, ref: ref, id: id, bgColor: bgColor, isPassword: true }, inputProps)),
             react_1.default.createElement(ShowPassword_1.default, { onClick: togglePasswordVisiblity, isRtl: dir === 'rtl' }, showPasswordText)),
@@ -75,0 +75,0 @@ hintText && react_1.default.createElement(HintText_1.default, { isError: isError }, hintText)));

lib/textInput/private/types/TextInputProps.d.ts

 /// <reference types="react" />
-import TextInputTypes from './TextInputTypes';
+import type TextInputTypes from './TextInputTypes';
 export default interface TextInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
     id?: string;
     inputSize?: 'md' | 'lg' | 'xl';
-    type: TextInputTypes | string;
+    type?: TextInputTypes | string;
     label?: JSX.Element | string;
@@ -13,3 +13,3 @@ placeholder?: string;
     showPasswordText?: JSX.Element | string;
-    backgroundColor?: string;
+    bgColor?: string;
     isSharpLeftSide?: boolean;
@@ -16,0 +16,0 @@ isSharpRightSide?: boolean;

lib/textInput/private/utils/getBorderRadius.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const getBorderRadius = (size) => {
-    switch (size) {
-        case 'xl':
-            return 'rounded-moon-i-md';
-        case 'lg':
-            return 'rounded-moon-i-sm';
-        default:
-            return 'rounded-moon-i-sm';
-    }
-};
+const getBorderRadius = (size) => size === 'xl' ? 'rounded-moon-i-md' : 'rounded-moon-i-sm';
 exports.default = getBorderRadius;

lib/textInput/TextInput.d.ts

 import React from 'react';
-import TextInputProps from './private/types/TextInputProps';
+import type TextInputProps from './private/types/TextInputProps';
 declare const TextInput: React.ForwardRefExoticComponent<TextInputProps & React.RefAttributes<HTMLInputElement>>;
 export default TextInput;
 //# sourceMappingURL=TextInput.d.ts.map

lib/textInput/TextInput.js

@@ -26,3 +26,2 @@ "use strict";
 const react_1 = __importStar(require("react"));
-const Size_1 = __importDefault(require("../private/enums/Size"));
 const TextInputBasic_1 = __importDefault(require("./private/TextInputBasic"));
@@ -32,3 +31,3 @@ const TextInputInnerLabel_1 = __importDefault(require("./private/TextInputInnerLabel"));
 const TextInput = react_1.forwardRef((props, ref) => {
-    const { inputSize = Size_1.default.md, type } = props;
+    const { inputSize = 'md', type } = props;
     //render input with show/hide password
@@ -35,0 +34,0 @@ if (type === 'password') {

package.json

 {
   "name": "@heathmont/moon-core-tw",
   "sideEffects": false,
-  "version": "9.3.1",
+  "version": "9.4.0",
   "files": [
@@ -15,3 +15,3 @@ "lib"
   "dependencies": {
-    "@heathmont/moon-icons-tw": "^9.3.1"
+    "@heathmont/moon-icons-tw": "^9.4.0"
   },
@@ -18,0 +18,0 @@ "peerDependencies": {

No alert changes

Worsened metrics

Total package byte prevSize

276511

decreased by-0.41%

Lines of code

4650

decreased by-0.7%

Dependency changes

• Updated@heathmont/moon-icons-tw@^9.4.0