funuicss 2.0.25 → 2.5.0

package/ui/text/Text.d.ts

@@ -1,16 +1,13 @@
 import React from 'react';
 type TypographyProps = {
     id?: string;
-    size?: "smaller" | "small" | "big" | "bigger" | "jumbo" | "minified";
+    text?: React.ReactNode;
+    funcss?: string;
     bg?: string;
     color?: string;
-    children?: React.ReactNode;
     hoverBg?: string;
     hoverText?: string;
     monospace?: boolean;
-    text?: string;
-    heading?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
-    funcss?: string;
     emp?: boolean;
     bold?: boolean;
     block?: boolean;
@@ -20,6 +17,7 @@ type TypographyProps = {
     lighter?: boolean;
     italic?: boolean;
     underline?: boolean;
+    weight?: number;
     quote?: boolean;
     align?: "left" | "center" | "right" | "justify";
     lineHeight?: string;
@@ -39,6 +37,8 @@ type TypographyProps = {
     transform?: string;
     customStyles?: React.CSSProperties;
     onClick?: () => void;
+    children?: React.ReactNode;
+    size?: "xs" | "sm" | "base" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
 };
 declare const Text: React.FC<TypographyProps>;
 export default Text;

package/ui/text/Text.js

@@ -28,33 +28,42 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
 var pi_1 = require("react-icons/pi");
 var Text = function (_a) {
-    var id = _a.id, size = _a.size, bg = _a.bg, color = _a.color, children = _a.children, hoverBg = _a.hoverBg, hoverText = _a.hoverText, text = _a.text, heading = _a.heading, funcss = _a.funcss, emp = _a.emp, bold = _a.bold, block = _a.block, body = _a.body, article = _a.article, light = _a.light, lighter = _a.lighter, italic = _a.italic, underline = _a.underline, align = _a.align, lineHeight = _a.lineHeight, letterSpacing = _a.letterSpacing, uppercase = _a.uppercase, lowercase = _a.lowercase, capitalize = _a.capitalize, textDecoration = _a.textDecoration, textTransform = _a.textTransform, whiteSpace = _a.whiteSpace, wordBreak = _a.wordBreak, fontFamily = _a.fontFamily, textShadow = _a.textShadow, textAlign = _a.textAlign, customStyles = _a.customStyles, monospace = _a.monospace, quote = _a.quote, rest = __rest(_a, ["id", "size", "bg", "color", "children", "hoverBg", "hoverText", "text", "heading", "funcss", "emp", "bold", "block", "body", "article", "light", "lighter", "italic", "underline", "align", "lineHeight", "letterSpacing", "uppercase", "lowercase", "capitalize", "textDecoration", "textTransform", "whiteSpace", "wordBreak", "fontFamily", "textShadow", "textAlign", "customStyles", "monospace", "quote"]);
-    var mergedStyles = __assign({ display: block ? 'block' : undefined, fontWeight: bold ? 'bold' : undefined, lineHeight: lineHeight ? lineHeight : undefined, letterSpacing: letterSpacing ? letterSpacing : undefined, textTransform: textTransform ? textTransform : undefined, textDecoration: textDecoration ? textDecoration : undefined, fontFamily: fontFamily ? fontFamily : undefined, textShadow: textShadow ? textShadow : undefined, textAlign: textAlign ? textAlign : undefined, whiteSpace: whiteSpace ? whiteSpace : undefined, wordBreak: wordBreak ? wordBreak : undefined, transform: customStyles === null || customStyles === void 0 ? void 0 : customStyles.transform }, customStyles);
+    var id = _a.id, bg = _a.bg, color = _a.color, children = _a.children, hoverBg = _a.hoverBg, hoverText = _a.hoverText, text = _a.text, funcss = _a.funcss, emp = _a.emp, bold = _a.bold, block = _a.block, body = _a.body, article = _a.article, light = _a.light, lighter = _a.lighter, italic = _a.italic, weight = _a.weight, underline = _a.underline, align = _a.align, lineHeight = _a.lineHeight, letterSpacing = _a.letterSpacing, uppercase = _a.uppercase, lowercase = _a.lowercase, capitalize = _a.capitalize, textDecoration = _a.textDecoration, textTransform = _a.textTransform, whiteSpace = _a.whiteSpace, wordBreak = _a.wordBreak, fontFamily = _a.fontFamily, textShadow = _a.textShadow, textAlign = _a.textAlign, customStyles = _a.customStyles, monospace = _a.monospace, quote = _a.quote, _b = _a.size, size = _b === void 0 ? 'base' : _b, // default
+    rest = __rest(_a, ["id", "bg", "color", "children", "hoverBg", "hoverText", "text", "funcss", "emp", "bold", "block", "body", "article", "light", "lighter", "italic", "weight", "underline", "align", "lineHeight", "letterSpacing", "uppercase", "lowercase", "capitalize", "textDecoration", "textTransform", "whiteSpace", "wordBreak", "fontFamily", "textShadow", "textAlign", "customStyles", "monospace", "quote", "size"]);
+    var Tag = block ? 'div' : 'span';
+    var sizeClass = "".concat(size === 'h1' ? "h1" :
+        size === 'h2' ? "h2" :
+            size === 'h3' ? "h3" :
+                size === 'h4' ? "h4" :
+                    size === 'h5' ? "h5" :
+                        size === 'h6' ? "h6" :
+                            "text-".concat(size));
+    var mergedStyles = __assign({ display: block ? 'block' : undefined, fontWeight: bold ? 'bold' : weight ? weight : undefined, lineHeight: lineHeight, letterSpacing: letterSpacing, textTransform: textTransform, textDecoration: textDecoration, fontFamily: fontFamily, textShadow: textShadow, textAlign: textAlign, whiteSpace: whiteSpace, wordBreak: wordBreak, transform: customStyles === null || customStyles === void 0 ? void 0 : customStyles.transform }, customStyles);
     var classNames = [
-        size ? "text-".concat(size) : '',
+        funcss || '',
+        sizeClass,
         color ? "text-".concat(color) : '',
         align ? "text-".concat(align) : '',
         monospace ? 'monospace' : '',
-        bg ? bg : '',
+        bg || '',
         hoverText ? "hover-text-".concat(hoverText) : '',
         hoverBg ? "hover-".concat(hoverBg) : '',
         light ? 'lightText' : lighter ? 'lighterText' : '',
-        heading ? heading : '',
         italic ? 'italicText' : '',
         underline ? 'underlineText' : '',
         body ? 'body' : '',
         article ? 'article' : '',
-        funcss ? funcss : '',
         emp ? 'emp' : '',
         bold ? 'bold' : '',
         uppercase ? 'uppercase' : '',
         lowercase ? 'lowercase' : '',
         capitalize ? 'capitalize' : '',
-    ].filter(Boolean).join(' ');
-    var HeadingTag = heading ? heading : block ? "div" : 'span';
-    return (react_1.default.createElement(HeadingTag, __assign({ id: id, className: classNames, style: mergedStyles }, rest),
-        quote && react_1.default.createElement("div", { className: "" },
-            react_1.default.createElement(pi_1.PiQuotesLight, null)),
+    ]
+        .filter(Boolean)
+        .join(' ');
+    return (react_1.default.createElement(Tag, __assign({ id: id, className: classNames, style: mergedStyles }, rest),
+        quote && (react_1.default.createElement("div", null,
+            react_1.default.createElement(pi_1.PiQuotesLight, null))),
         children,
         text));
 };

package/ui/text/Text.tsx

@@ -3,16 +3,13 @@ import { PiQuotesLight } from 'react-icons/pi';
 
 type TypographyProps = {
   id?: string;
-  size?: "smaller" | "small" | "big" | "bigger" | "jumbo" | "minified";
+  text?: React.ReactNode;
+  funcss?: string;
   bg?: string;
   color?: string;
-  children?: React.ReactNode;
   hoverBg?: string;
   hoverText?: string;
   monospace?: boolean;
-  text?: string;
-  heading?: "h1" | "h2" |"h3" |"h4" |"h5" |"h6" ;
-  funcss?: string;
   emp?: boolean;
   bold?: boolean;
   block?: boolean;
@@ -22,7 +19,8 @@ type TypographyProps = {
   lighter?: boolean;
   italic?: boolean;
   underline?: boolean;
-  quote?:boolean;
+  weight?: number;
+  quote?: boolean;
   align?: "left" | "center" | "right" | "justify";
   lineHeight?: string;
   letterSpacing?: string;
@@ -41,18 +39,38 @@ type TypographyProps = {
   transform?: string;
   customStyles?: React.CSSProperties;
   onClick?: () => void;
+  children?: React.ReactNode;
+
+  size?: 
+    | "xs" 
+    | "sm" 
+    | "base" 
+    | "lg" 
+    | "xl" 
+    | "2xl" 
+    | "3xl" 
+    | "4xl" 
+    | "5xl" 
+    | "6xl"
+    | "7xl"
+    | "8xl"
+    | "9xl"
+    | "h1" 
+    | "h2" 
+    | "h3" 
+    | "h4" 
+    | "h5" 
+    | "h6";
 };
 
 const Text: React.FC<TypographyProps> = ({
   id,
-  size,
   bg,
   color,
   children,
   hoverBg,
   hoverText,
   text,
-  heading,
   funcss,
   emp,
   bold,
@@ -62,6 +80,7 @@ const Text: React.FC<TypographyProps> = ({
   light,
   lighter,
   italic,
+  weight,
   underline,
   align,
   lineHeight,
@@ -79,59 +98,69 @@ const Text: React.FC<TypographyProps> = ({
   customStyles,
   monospace,
   quote,
+  size = 'base', // default
+
   ...rest
 }) => {
+  const Tag = block ? 'div' : 'span';
+
+  const sizeClass = `${size === 'h1' ? `h1` : 
+    size === 'h2' ? `h2` : 
+    size === 'h3' ? `h3` : 
+    size === 'h4' ? `h4` : 
+    size === 'h5' ? `h5` : 
+    size === 'h6' ? `h6` : 
+    `text-${size}`}`;
+
   const mergedStyles: React.CSSProperties = {
     display: block ? 'block' : undefined,
-    fontWeight: bold ? 'bold' : undefined,
-    lineHeight: lineHeight ? lineHeight : undefined,
-    letterSpacing: letterSpacing ? letterSpacing : undefined,
-    textTransform: textTransform ? textTransform : undefined,
-    textDecoration: textDecoration ? textDecoration : undefined,
-    fontFamily: fontFamily ? fontFamily : undefined,
-    textShadow: textShadow ? textShadow : undefined,
-    textAlign: textAlign ? textAlign : undefined,
-    whiteSpace: whiteSpace ? whiteSpace : undefined,
-    wordBreak: wordBreak ? wordBreak : undefined,
+    fontWeight: bold ? 'bold' : weight ? weight : undefined,
+    lineHeight,
+    letterSpacing,
+    textTransform,
+    textDecoration,
+    fontFamily,
+    textShadow,
+    textAlign,
+    whiteSpace,
+    wordBreak,
     transform: customStyles?.transform,
     ...customStyles,
   };
 
   const classNames = [
-    size ? `text-${size}` : '',
+    funcss || '',
+    sizeClass,
     color ? `text-${color}` : '',
     align ? `text-${align}` : '',
     monospace ? 'monospace' : '',
-    bg ? bg : '',
+    bg || '',
     hoverText ? `hover-text-${hoverText}` : '',
     hoverBg ? `hover-${hoverBg}` : '',
     light ? 'lightText' : lighter ? 'lighterText' : '',
-    heading ? heading : '',
     italic ? 'italicText' : '',
     underline ? 'underlineText' : '',
     body ? 'body' : '',
     article ? 'article' : '',
-    funcss ? funcss : '',
     emp ? 'emp' : '',
     bold ? 'bold' : '',
     uppercase ? 'uppercase' : '',
     lowercase ? 'lowercase' : '',
     capitalize ? 'capitalize' : '',
-  ].filter(Boolean).join(' ');
-
-  const HeadingTag = heading ? heading : block ? "div" : 'span';
+  ]
+    .filter(Boolean)
+    .join(' ');
 
   return (
-    <HeadingTag
-      id={id}
-      className={classNames}
-      style={mergedStyles}
-      {...rest}
-    >
-      {quote && <div className=""><PiQuotesLight /></div>}
+    <Tag id={id} className={classNames} style={mergedStyles} {...rest}>
+      {quote && (
+        <div>
+          <PiQuotesLight />
+        </div>
+      )}
       {children}
       {text}
-    </HeadingTag>
+    </Tag>
   );
 };
 

package/ui/tooltip/Tip.d.ts

@@ -4,8 +4,9 @@ interface TipProps {
     funcss?: string;
     children?: React.ReactNode;
     content?: React.ReactNode;
+    message?: React.ReactNode;
     animation?: string;
     duration?: number;
 }
-export default function Tip({ tip, funcss, children, content, animation, duration, ...rest }: TipProps): any;
+export default function Tip({ tip, funcss, children, content, message, animation, duration, ...rest }: TipProps): React.JSX.Element;
 export {};

package/ui/tooltip/Tip.js

@@ -47,10 +47,14 @@ var __rest = (this && this.__rest) || function (s, e) {
 Object.defineProperty(exports, "__esModule", { value: true });
 var React = __importStar(require("react"));
 function Tip(_a) {
-    var tip = _a.tip, funcss = _a.funcss, children = _a.children, content = _a.content, animation = _a.animation, duration = _a.duration, rest = __rest(_a, ["tip", "funcss", "children", "content", "animation", "duration"]);
-    return (React.createElement("span", __assign({ className: "tip-".concat(tip, " tip ").concat(funcss ? funcss : ''), style: { animation: " ".concat(duration ? duration : 0, "s ").concat(animation ? animation : '') } }, rest),
-        children,
-        " ",
-        content));
+    var tip = _a.tip, funcss = _a.funcss, children = _a.children, content = _a.content, message = _a.message, animation = _a.animation, duration = _a.duration, rest = __rest(_a, ["tip", "funcss", "children", "content", "message", "animation", "duration"]);
+    // Calculate width only if content is a string
+    var text = message || content || children;
+    // Check if content is a plain string to calculate width
+    var isString = typeof text === 'string';
+    var minWidth = isString
+        ? "".concat(text.replace(/\s+/g, '').length * 8, "px")
+        : 'auto';
+    return (React.createElement("span", __assign({ className: "tip-".concat(tip, " tip ").concat(funcss ? funcss : ''), style: { animation: " ".concat(duration ? duration : 0, "s ").concat(animation ? animation : ''), minWidth: minWidth } }, rest), text));
 }
 exports.default = Tip;

package/ui/tooltip/Tip.tsx

@@ -5,6 +5,7 @@ interface TipProps {
   funcss?: string;
   children?: React.ReactNode;
   content?: React.ReactNode;
+  message?: React.ReactNode;
   animation?: string;
   duration?: number;
 } 
@@ -14,17 +15,26 @@ export default function Tip({
   funcss,
   children,
   content,
+  message,
   animation,
   duration,
   ...rest
 }: TipProps) {
+  // Calculate width only if content is a string
+  const text = message || content || children;
+  // Check if content is a plain string to calculate width
+  const isString = typeof text === 'string';
+  const minWidth = isString
+    ? `${text.replace(/\s+/g, '').length * 8}px`
+    : 'auto';
   return (
     <span
       className={`tip-${tip} tip ${funcss ? funcss : ''}`}
-      style={{ animation: ` ${duration ? duration : 0}s ${animation ? animation : ''}` }}
+      style={{ animation: ` ${duration ? duration : 0}s ${animation ? animation : ''}`, minWidth: minWidth }}
       {...rest}
     >
-      {children} {content}
+      {text}
+      
     </span>
   );
 }

package/ui/tooltip/ToolTip.d.ts

@@ -3,5 +3,5 @@ interface ToolTipProps {
     funcss?: string;
     children?: React.ReactNode;
 }
-export default function ToolTip({ funcss, children, ...rest }: ToolTipProps): any;
+export default function ToolTip({ funcss, children, ...rest }: ToolTipProps): React.JSX.Element;
 export {};

package/ui/tooltip/ToolTip.js

@@ -48,6 +48,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var React = __importStar(require("react"));
 function ToolTip(_a) {
     var funcss = _a.funcss, children = _a.children, rest = __rest(_a, ["funcss", "children"]);
-    return (React.createElement("span", __assign({ className: "tooltip ".concat(funcss ? funcss : '') }, rest), children));
+    return (React.createElement("span", __assign({ className: "tooltip ".concat(funcss !== null && funcss !== void 0 ? funcss : '') }, rest), children));
 }
 exports.default = ToolTip;

package/ui/tooltip/ToolTip.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import Tip from './Tip';
 
 interface ToolTipProps {
   funcss?: string;
@@ -6,8 +7,13 @@ interface ToolTipProps {
 }
 
 export default function ToolTip({ funcss, children, ...rest }: ToolTipProps) {
+
   return (
-    <span className={`tooltip ${funcss ? funcss : ''}`} {...rest}>
+    <span
+ 
+      className={`tooltip ${funcss ?? ''}`}
+      {...rest}
+    >
       {children}
     </span>
   );

package/ui/video/FunPlayer.d.ts

@@ -1,7 +0,0 @@
-interface VideoProps {
-    src: string;
-    autoPlay: boolean;
-    onDuration?: (duration: number) => void;
-}
-export default function Video({ src, autoPlay, onDuration }: VideoProps): any;
-export {};