@allxsmith/bestax-bulma 1.0.12 → 1.1.0

package/dist/index.cjs.js

@@ -594,7 +594,7 @@ const validViewports = [
     'fullhd',
 ];
 const useBulmaClasses = (props) => {
-    const { color, backgroundColor, colorShade, m, mt, mr, mb, ml, mx, my, p, pt, pr, pb, pl, px, py, textSize, textAlign, textTransform, textWeight, fontFamily, display, visibility, flexDirection, flexWrap, justifyContent, alignContent, alignItems, alignSelf, flexGrow, flexShrink, float, overflow, overlay, interaction, radius, shadow, responsive, viewport, ...rest } = props;
+    const { color, backgroundColor, colorShade, m, mt, mr, mb, ml, mx, my, p, pt, pr, pb, pl, px, py, textSize, textAlign, textTransform, textWeight, fontFamily, display, visibility, flexDirection, flexWrap, justifyContent, alignContent, alignItems, alignSelf, flexGrow, flexShrink, float, overflow, overlay, interaction, radius, shadow, responsive, viewport, skeleton, ...rest } = props;
     const bulmaHelperClasses = React.useMemo(() => {
         const classes = [];
         const addClass = (prefix, value, validValues) => {
@@ -681,6 +681,9 @@ const useBulmaClasses = (props) => {
         if (responsive) {
             addClass('is', responsive, ['mobile', 'narrow']);
         }
+        if (skeleton) {
+            classes.push('is-skeleton');
+        }
         return classNames(classes);
     }, [
         color,
@@ -723,6 +726,7 @@ const useBulmaClasses = (props) => {
         shadow,
         responsive,
         viewport,
+        skeleton,
     ]);
     return { bulmaHelperClasses, rest };
 };
@@ -1418,12 +1422,13 @@ const validSubTitleElements = [
     'h6',
     'p',
 ];
-const SubTitle = ({ className, size, as = 'h1', children, ...props }) => {
+const SubTitle = ({ className, size, as = 'h1', hasSkeleton, children, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({ ...props });
     const element = validSubTitleElements.includes(as) ? as : 'h1';
     const validSize = size && validSubTitleSizes.includes(size) ? size : undefined;
     const subTitleClasses = classNames('subtitle', className, bulmaHelperClasses, {
         [`is-${validSize}`]: validSize,
+        'has-skeleton': hasSkeleton,
     });
     const Tag = element === 'p' ? 'p' : validSize ? `h${validSize}` : element;
     return (jsxRuntimeExports.jsx(Tag, { className: subTitleClasses, ...rest, children: children }));
@@ -1531,13 +1536,14 @@ const Thead = ({ className, children, ...props }) => {
 
 const validTitleSizes = ['1', '2', '3', '4', '5', '6'];
 const validTitleElements = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p'];
-const Title = ({ className, size, isSpaced, as = 'h1', children, ...props }) => {
+const Title = ({ className, size, isSpaced, as = 'h1', hasSkeleton, children, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({ ...props });
     const element = validTitleElements.includes(as) ? as : 'h1';
     const validSize = size && validTitleSizes.includes(size) ? size : undefined;
     const titleClasses = classNames('title', className, bulmaHelperClasses, {
         [`is-${validSize}`]: validSize,
         'is-spaced': isSpaced,
+        'has-skeleton': hasSkeleton,
     });
     const Tag = element === 'p' ? 'p' : validSize ? `h${validSize}` : element;
     return (jsxRuntimeExports.jsx(Tag, { className: titleClasses, ...rest, children: children }));