@zimyo/ui 1.2.1 → 1.4.0

package/dist/Tabs/index.esm.js

@@ -1,202 +1 @@
-import React from 'react';
-import { useTheme, Box, Tab, Tabs as Tabs$1, alpha } from '@mui/material';
-
-// Custom Tab Component
-const CustomTab = React.forwardRef(({ badge, sx, label, ...props }, ref) => {
-    const theme = useTheme();
-    const tabLabel = badge ? React.createElement(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 } }, label, React.createElement(Box, {
-        component: 'span',
-        sx: {
-            backgroundColor: theme.palette.error.main,
-            color: theme.palette.error.contrastText,
-            borderRadius: '10px',
-            padding: '2px 6px',
-            fontSize: '0.75rem',
-            fontWeight: 600,
-            minWidth: '18px',
-            height: '18px',
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            lineHeight: 1,
-        }
-    }, badge)) : label;
-    return React.createElement(Tab, {
-        ref,
-        sx: {
-            position: 'relative',
-            ...sx,
-        },
-        label: tabLabel,
-        ...props
-    });
-});
-CustomTab.displayName = 'CustomTab';
-// Main Tabs Component
-const Tabs = React.forwardRef(({ items, value, onChange, variant = 'standard', orientation = 'horizontal', styleVariant = 'default', size = 'medium', centered = false, allowScrollButtonsMobile = false, scrollButtons = 'auto', sx = {}, tabSx = {}, iconPosition = 'start', indicatorColor = 'primary', textColor = 'primary', ...props }, ref) => {
-    const theme = useTheme();
-    // Get size-based styling
-    const getSizeStyles = () => {
-        switch (size) {
-            case 'small':
-                return {
-                    minHeight: 36,
-                    fontSize: '0.875rem',
-                    padding: '6px 12px',
-                };
-            case 'large':
-                return {
-                    minHeight: 56,
-                    fontSize: '1rem',
-                    padding: '12px 24px',
-                };
-            default:
-                return {
-                    minHeight: 48,
-                    fontSize: '0.9375rem',
-                    padding: '8px 16px',
-                };
-        }
-    };
-    // Get style variant specific styling
-    const getStyleVariantStyles = () => {
-        const baseStyles = getSizeStyles();
-        switch (styleVariant) {
-            case 'filled':
-                return {
-                    '& .MuiTab-root': {
-                        ...baseStyles,
-                        backgroundColor: alpha(theme.palette.action.hover, 0.08),
-                        borderRadius: theme.shape.borderRadius,
-                        margin: '0 4px',
-                        border: 'none',
-                        '&.Mui-selected': {
-                            backgroundColor: theme.palette.primary.main,
-                            color: theme.palette.primary.contrastText,
-                        },
-                        '&:hover': {
-                            backgroundColor: alpha(theme.palette.action.hover, 0.12),
-                        },
-                    },
-                    '& .MuiTabs-indicator': {
-                        display: 'none',
-                    },
-                };
-            case 'outlined':
-                return {
-                    '& .MuiTab-root': {
-                        ...baseStyles,
-                        border: `1px solid ${alpha(theme.palette.divider, 0.5)}`,
-                        borderRadius: theme.shape.borderRadius,
-                        margin: '0 2px',
-                        '&.Mui-selected': {
-                            borderColor: theme.palette.primary.main,
-                            backgroundColor: alpha(theme.palette.primary.main, 0.08),
-                            color: theme.palette.primary.main,
-                        },
-                        '&:hover': {
-                            borderColor: alpha(theme.palette.primary.main, 0.5),
-                        },
-                    },
-                    '& .MuiTabs-indicator': {
-                        display: 'none',
-                    },
-                };
-            case 'pills':
-                return {
-                    '& .MuiTab-root': {
-                        ...baseStyles,
-                        borderRadius: 25,
-                        margin: '0 4px',
-                        backgroundColor: 'transparent',
-                        border: `1px solid transparent`,
-                        '&.Mui-selected': {
-                            backgroundColor: theme.palette.primary.main,
-                            color: theme.palette.primary.contrastText,
-                        },
-                        '&:hover': {
-                            backgroundColor: alpha(theme.palette.action.hover, 0.08),
-                        },
-                    },
-                    '& .MuiTabs-indicator': {
-                        display: 'none',
-                    },
-                };
-            case 'underlined':
-                return {
-                    '& .MuiTab-root': {
-                        ...baseStyles,
-                        borderBottom: `2px solid transparent`,
-                        '&.Mui-selected': {
-                            borderBottomColor: theme.palette.primary.main,
-                        },
-                    },
-                    '& .MuiTabs-indicator': {
-                        display: 'none',
-                    },
-                };
-            default:
-                return {
-                    '& .MuiTab-root': {
-                        ...baseStyles,
-                    },
-                };
-        }
-    };
-    return React.createElement(Box, { ref }, React.createElement(Tabs$1, {
-        value,
-        onChange,
-        variant,
-        orientation,
-        centered,
-        allowScrollButtonsMobile,
-        scrollButtons,
-        indicatorColor,
-        textColor,
-        sx: {
-            ...getStyleVariantStyles(),
-            '& .MuiTab-root': {
-                textTransform: 'none',
-                fontWeight: 500,
-                letterSpacing: '0.5px',
-                transition: 'all 0.2s ease-in-out',
-                ...getStyleVariantStyles()['& .MuiTab-root'],
-                ...tabSx,
-            },
-            ...sx,
-        },
-        ...props,
-    }, ...items.map((item) => {
-        // Create the label content based on icon position
-        let labelContent;
-        if (item.icon) {
-            switch (iconPosition) {
-                case 'end':
-                    labelContent = React.createElement(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1, flexDirection: 'row-reverse' } }, item.icon, item.label);
-                    break;
-                case 'top':
-                    labelContent = React.createElement(Box, { sx: { display: 'flex', alignItems: 'center', gap: 0.5, flexDirection: 'column' } }, item.icon, item.label);
-                    break;
-                case 'bottom':
-                    labelContent = React.createElement(Box, { sx: { display: 'flex', alignItems: 'center', gap: 0.5, flexDirection: 'column-reverse' } }, item.icon, item.label);
-                    break;
-                default: // 'start'
-                    labelContent = React.createElement(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 } }, item.icon, item.label);
-                    break;
-            }
-        }
-        else {
-            labelContent = item.label;
-        }
-        return React.createElement(CustomTab, {
-            key: item.value,
-            value: item.value,
-            disabled: item.disabled,
-            badge: item.badge,
-            label: labelContent,
-        });
-    })));
-});
-Tabs.displayName = 'Tabs';
-
-export { Tabs, Tabs as default };
+import e from"react";import{useTheme as r,Box as t,Tab as a,Tabs as o,alpha as i}from"@mui/material";const n=e.forwardRef(({badge:o,sx:i,label:n,...l},s)=>{const d=r(),c=o?e.createElement(t,{sx:{display:"flex",alignItems:"center",gap:1}},n,e.createElement(t,{component:"span",sx:{backgroundColor:d.palette.error.main,color:d.palette.error.contrastText,borderRadius:"10px",padding:"2px 6px",fontSize:"0.75rem",fontWeight:600,minWidth:"18px",height:"18px",display:"flex",alignItems:"center",justifyContent:"center",lineHeight:1}},o)):n;return e.createElement(a,{ref:s,sx:{position:"relative",...i},label:c,...l})});n.displayName="CustomTab";const l=e.forwardRef(({items:a,value:l,onChange:s,variant:d="standard",orientation:c="horizontal",styleVariant:p="default",size:m="medium",centered:u=!1,allowScrollButtonsMobile:b=!1,scrollButtons:x="auto",sx:g={},tabSx:f={},iconPosition:y="start",indicatorColor:h="primary",textColor:C="primary",...T},v)=>{const M=r(),k=()=>{const e=(()=>{switch(m){case"small":return{minHeight:36,fontSize:"0.875rem",padding:"6px 12px"};case"large":return{minHeight:56,fontSize:"1rem",padding:"12px 24px"};default:return{minHeight:48,fontSize:"0.9375rem",padding:"8px 16px"}}})();switch(p){case"filled":return{"& .MuiTab-root":{...e,backgroundColor:i(M.palette.action.hover,.08),borderRadius:M.shape.borderRadius,margin:"0 4px",border:"none","&.Mui-selected":{backgroundColor:M.palette.primary.main,color:M.palette.primary.contrastText},"&:hover":{backgroundColor:i(M.palette.action.hover,.12)}},"& .MuiTabs-indicator":{display:"none"}};case"outlined":return{"& .MuiTab-root":{...e,border:`1px solid ${i(M.palette.divider,.5)}`,borderRadius:M.shape.borderRadius,margin:"0 2px","&.Mui-selected":{borderColor:M.palette.primary.main,backgroundColor:i(M.palette.primary.main,.08),color:M.palette.primary.main},"&:hover":{borderColor:i(M.palette.primary.main,.5)}},"& .MuiTabs-indicator":{display:"none"}};case"pills":return{"& .MuiTab-root":{...e,borderRadius:25,margin:"0 4px",backgroundColor:"transparent",border:"1px solid transparent","&.Mui-selected":{backgroundColor:M.palette.primary.main,color:M.palette.primary.contrastText},"&:hover":{backgroundColor:i(M.palette.action.hover,.08)}},"& .MuiTabs-indicator":{display:"none"}};case"underlined":return{"& .MuiTab-root":{...e,borderBottom:"2px solid transparent","&.Mui-selected":{borderBottomColor:M.palette.primary.main}},"& .MuiTabs-indicator":{display:"none"}};default:return{"& .MuiTab-root":{...e}}}};return e.createElement(t,{ref:v},e.createElement(o,{value:l,onChange:s,variant:d,orientation:c,centered:u,allowScrollButtonsMobile:b,scrollButtons:x,indicatorColor:h,textColor:C,sx:{...k(),"& .MuiTab-root":{textTransform:"none",fontWeight:500,letterSpacing:"0.5px",transition:"all 0.2s ease-in-out",...k()["& .MuiTab-root"],...f},...g},...T},...a.map(r=>{let a;if(r.icon)switch(y){case"end":a=e.createElement(t,{sx:{display:"flex",alignItems:"center",gap:1,flexDirection:"row-reverse"}},r.icon,r.label);break;case"top":a=e.createElement(t,{sx:{display:"flex",alignItems:"center",gap:.5,flexDirection:"column"}},r.icon,r.label);break;case"bottom":a=e.createElement(t,{sx:{display:"flex",alignItems:"center",gap:.5,flexDirection:"column-reverse"}},r.icon,r.label);break;default:a=e.createElement(t,{sx:{display:"flex",alignItems:"center",gap:1}},r.icon,r.label)}else a=r.label;return e.createElement(n,{key:r.value,value:r.value,disabled:r.disabled,badge:r.badge,label:a})})))});l.displayName="Tabs";export{l as Tabs,l as default};

package/dist/Tabs/index.js

@@ -1,207 +1 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-var material = require('@mui/material');
-
-// Custom Tab Component
-const CustomTab = React.forwardRef(({ badge, sx, label, ...props }, ref) => {
-    const theme = material.useTheme();
-    const tabLabel = badge ? React.createElement(material.Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 } }, label, React.createElement(material.Box, {
-        component: 'span',
-        sx: {
-            backgroundColor: theme.palette.error.main,
-            color: theme.palette.error.contrastText,
-            borderRadius: '10px',
-            padding: '2px 6px',
-            fontSize: '0.75rem',
-            fontWeight: 600,
-            minWidth: '18px',
-            height: '18px',
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            lineHeight: 1,
-        }
-    }, badge)) : label;
-    return React.createElement(material.Tab, {
-        ref,
-        sx: {
-            position: 'relative',
-            ...sx,
-        },
-        label: tabLabel,
-        ...props
-    });
-});
-CustomTab.displayName = 'CustomTab';
-// Main Tabs Component
-const Tabs = React.forwardRef(({ items, value, onChange, variant = 'standard', orientation = 'horizontal', styleVariant = 'default', size = 'medium', centered = false, allowScrollButtonsMobile = false, scrollButtons = 'auto', sx = {}, tabSx = {}, iconPosition = 'start', indicatorColor = 'primary', textColor = 'primary', ...props }, ref) => {
-    const theme = material.useTheme();
-    // Get size-based styling
-    const getSizeStyles = () => {
-        switch (size) {
-            case 'small':
-                return {
-                    minHeight: 36,
-                    fontSize: '0.875rem',
-                    padding: '6px 12px',
-                };
-            case 'large':
-                return {
-                    minHeight: 56,
-                    fontSize: '1rem',
-                    padding: '12px 24px',
-                };
-            default:
-                return {
-                    minHeight: 48,
-                    fontSize: '0.9375rem',
-                    padding: '8px 16px',
-                };
-        }
-    };
-    // Get style variant specific styling
-    const getStyleVariantStyles = () => {
-        const baseStyles = getSizeStyles();
-        switch (styleVariant) {
-            case 'filled':
-                return {
-                    '& .MuiTab-root': {
-                        ...baseStyles,
-                        backgroundColor: material.alpha(theme.palette.action.hover, 0.08),
-                        borderRadius: theme.shape.borderRadius,
-                        margin: '0 4px',
-                        border: 'none',
-                        '&.Mui-selected': {
-                            backgroundColor: theme.palette.primary.main,
-                            color: theme.palette.primary.contrastText,
-                        },
-                        '&:hover': {
-                            backgroundColor: material.alpha(theme.palette.action.hover, 0.12),
-                        },
-                    },
-                    '& .MuiTabs-indicator': {
-                        display: 'none',
-                    },
-                };
-            case 'outlined':
-                return {
-                    '& .MuiTab-root': {
-                        ...baseStyles,
-                        border: `1px solid ${material.alpha(theme.palette.divider, 0.5)}`,
-                        borderRadius: theme.shape.borderRadius,
-                        margin: '0 2px',
-                        '&.Mui-selected': {
-                            borderColor: theme.palette.primary.main,
-                            backgroundColor: material.alpha(theme.palette.primary.main, 0.08),
-                            color: theme.palette.primary.main,
-                        },
-                        '&:hover': {
-                            borderColor: material.alpha(theme.palette.primary.main, 0.5),
-                        },
-                    },
-                    '& .MuiTabs-indicator': {
-                        display: 'none',
-                    },
-                };
-            case 'pills':
-                return {
-                    '& .MuiTab-root': {
-                        ...baseStyles,
-                        borderRadius: 25,
-                        margin: '0 4px',
-                        backgroundColor: 'transparent',
-                        border: `1px solid transparent`,
-                        '&.Mui-selected': {
-                            backgroundColor: theme.palette.primary.main,
-                            color: theme.palette.primary.contrastText,
-                        },
-                        '&:hover': {
-                            backgroundColor: material.alpha(theme.palette.action.hover, 0.08),
-                        },
-                    },
-                    '& .MuiTabs-indicator': {
-                        display: 'none',
-                    },
-                };
-            case 'underlined':
-                return {
-                    '& .MuiTab-root': {
-                        ...baseStyles,
-                        borderBottom: `2px solid transparent`,
-                        '&.Mui-selected': {
-                            borderBottomColor: theme.palette.primary.main,
-                        },
-                    },
-                    '& .MuiTabs-indicator': {
-                        display: 'none',
-                    },
-                };
-            default:
-                return {
-                    '& .MuiTab-root': {
-                        ...baseStyles,
-                    },
-                };
-        }
-    };
-    return React.createElement(material.Box, { ref }, React.createElement(material.Tabs, {
-        value,
-        onChange,
-        variant,
-        orientation,
-        centered,
-        allowScrollButtonsMobile,
-        scrollButtons,
-        indicatorColor,
-        textColor,
-        sx: {
-            ...getStyleVariantStyles(),
-            '& .MuiTab-root': {
-                textTransform: 'none',
-                fontWeight: 500,
-                letterSpacing: '0.5px',
-                transition: 'all 0.2s ease-in-out',
-                ...getStyleVariantStyles()['& .MuiTab-root'],
-                ...tabSx,
-            },
-            ...sx,
-        },
-        ...props,
-    }, ...items.map((item) => {
-        // Create the label content based on icon position
-        let labelContent;
-        if (item.icon) {
-            switch (iconPosition) {
-                case 'end':
-                    labelContent = React.createElement(material.Box, { sx: { display: 'flex', alignItems: 'center', gap: 1, flexDirection: 'row-reverse' } }, item.icon, item.label);
-                    break;
-                case 'top':
-                    labelContent = React.createElement(material.Box, { sx: { display: 'flex', alignItems: 'center', gap: 0.5, flexDirection: 'column' } }, item.icon, item.label);
-                    break;
-                case 'bottom':
-                    labelContent = React.createElement(material.Box, { sx: { display: 'flex', alignItems: 'center', gap: 0.5, flexDirection: 'column-reverse' } }, item.icon, item.label);
-                    break;
-                default: // 'start'
-                    labelContent = React.createElement(material.Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 } }, item.icon, item.label);
-                    break;
-            }
-        }
-        else {
-            labelContent = item.label;
-        }
-        return React.createElement(CustomTab, {
-            key: item.value,
-            value: item.value,
-            disabled: item.disabled,
-            badge: item.badge,
-            label: labelContent,
-        });
-    })));
-});
-Tabs.displayName = 'Tabs';
-
-exports.Tabs = Tabs;
-exports.default = Tabs;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),a=require("@mui/material");const r=e.forwardRef(({badge:r,sx:t,label:o,...i},n)=>{const l=a.useTheme(),s=r?e.createElement(a.Box,{sx:{display:"flex",alignItems:"center",gap:1}},o,e.createElement(a.Box,{component:"span",sx:{backgroundColor:l.palette.error.main,color:l.palette.error.contrastText,borderRadius:"10px",padding:"2px 6px",fontSize:"0.75rem",fontWeight:600,minWidth:"18px",height:"18px",display:"flex",alignItems:"center",justifyContent:"center",lineHeight:1}},r)):o;return e.createElement(a.Tab,{ref:n,sx:{position:"relative",...t},label:s,...i})});r.displayName="CustomTab";const t=e.forwardRef(({items:t,value:o,onChange:i,variant:n="standard",orientation:l="horizontal",styleVariant:s="default",size:d="medium",centered:p=!1,allowScrollButtonsMobile:c=!1,scrollButtons:u="auto",sx:m={},tabSx:b={},iconPosition:x="start",indicatorColor:g="primary",textColor:f="primary",...h},y)=>{const T=a.useTheme(),v=()=>{const e=(()=>{switch(d){case"small":return{minHeight:36,fontSize:"0.875rem",padding:"6px 12px"};case"large":return{minHeight:56,fontSize:"1rem",padding:"12px 24px"};default:return{minHeight:48,fontSize:"0.9375rem",padding:"8px 16px"}}})();switch(s){case"filled":return{"& .MuiTab-root":{...e,backgroundColor:a.alpha(T.palette.action.hover,.08),borderRadius:T.shape.borderRadius,margin:"0 4px",border:"none","&.Mui-selected":{backgroundColor:T.palette.primary.main,color:T.palette.primary.contrastText},"&:hover":{backgroundColor:a.alpha(T.palette.action.hover,.12)}},"& .MuiTabs-indicator":{display:"none"}};case"outlined":return{"& .MuiTab-root":{...e,border:`1px solid ${a.alpha(T.palette.divider,.5)}`,borderRadius:T.shape.borderRadius,margin:"0 2px","&.Mui-selected":{borderColor:T.palette.primary.main,backgroundColor:a.alpha(T.palette.primary.main,.08),color:T.palette.primary.main},"&:hover":{borderColor:a.alpha(T.palette.primary.main,.5)}},"& .MuiTabs-indicator":{display:"none"}};case"pills":return{"& .MuiTab-root":{...e,borderRadius:25,margin:"0 4px",backgroundColor:"transparent",border:"1px solid transparent","&.Mui-selected":{backgroundColor:T.palette.primary.main,color:T.palette.primary.contrastText},"&:hover":{backgroundColor:a.alpha(T.palette.action.hover,.08)}},"& .MuiTabs-indicator":{display:"none"}};case"underlined":return{"& .MuiTab-root":{...e,borderBottom:"2px solid transparent","&.Mui-selected":{borderBottomColor:T.palette.primary.main}},"& .MuiTabs-indicator":{display:"none"}};default:return{"& .MuiTab-root":{...e}}}};return e.createElement(a.Box,{ref:y},e.createElement(a.Tabs,{value:o,onChange:i,variant:n,orientation:l,centered:p,allowScrollButtonsMobile:c,scrollButtons:u,indicatorColor:g,textColor:f,sx:{...v(),"& .MuiTab-root":{textTransform:"none",fontWeight:500,letterSpacing:"0.5px",transition:"all 0.2s ease-in-out",...v()["& .MuiTab-root"],...b},...m},...h},...t.map(t=>{let o;if(t.icon)switch(x){case"end":o=e.createElement(a.Box,{sx:{display:"flex",alignItems:"center",gap:1,flexDirection:"row-reverse"}},t.icon,t.label);break;case"top":o=e.createElement(a.Box,{sx:{display:"flex",alignItems:"center",gap:.5,flexDirection:"column"}},t.icon,t.label);break;case"bottom":o=e.createElement(a.Box,{sx:{display:"flex",alignItems:"center",gap:.5,flexDirection:"column-reverse"}},t.icon,t.label);break;default:o=e.createElement(a.Box,{sx:{display:"flex",alignItems:"center",gap:1}},t.icon,t.label)}else o=t.label;return e.createElement(r,{key:t.value,value:t.value,disabled:t.disabled,badge:t.badge,label:o})})))});t.displayName="Tabs",exports.Tabs=t,exports.default=t;

package/dist/Typography/index.esm.js

@@ -1,57 +1 @@
-import { jsx } from 'react/jsx-runtime';
-import { Typography, Box } from '@mui/material';
-
-const Heading = ({ level = 1, ...props }) => {
-    const variant = `h${level}`;
-    return (jsx(Typography, { variant: variant, component: props.component || `h${level}`, fontWeight: 600, gutterBottom: true, ...props }));
-};
-
-const Text = ({ size = 'md', ...props }) => {
-    const variantMap = {
-        sm: 'body2',
-        md: 'body1',
-        lg: 'subtitle1',
-    };
-    return (jsx(Typography, { variant: variantMap[size], component: props.component || 'p', ...props }));
-};
-
-const Lead = (props) => {
-    return (jsx(Typography, { variant: "subtitle1", component: props.component || 'p', fontWeight: 400, color: "text.secondary", ...props }));
-};
-
-const Muted = (props) => {
-    return (jsx(Typography, { variant: "body2", component: props.component || 'span', color: "text.disabled", ...props }));
-};
-
-const Strong = (props) => {
-    return (jsx(Typography, { component: props.component || 'strong', fontWeight: 500, display: "inline", ...props }));
-};
-
-const Caption = (props) => {
-    return (jsx(Typography, { variant: "caption", color: "text.secondary", component: props.component || 'span', ...props }));
-};
-
-const Blockquote = (props) => {
-    return (jsx(Typography, { component: "blockquote", sx: {
-            borderLeft: '4px solid',
-            borderColor: 'divider',
-            pl: 2,
-            color: 'text.secondary',
-            fontStyle: 'italic',
-        }, ...props }));
-};
-
-const Code = ({ children, sx }) => {
-    return (jsx(Box, { component: "code", sx: {
-            fontFamily: 'monospace',
-            backgroundColor: 'grey.100',
-            color: 'primary.main',
-            px: 0.5,
-            py: 0.25,
-            borderRadius: 1,
-            fontSize: '0.875rem',
-            ...sx,
-        }, children: children }));
-};
-
-export { Blockquote, Caption, Code, Heading, Lead, Muted, Strong, Text };
+import{jsx as o}from"react/jsx-runtime";import{Typography as t,Box as n}from"@mui/material";const e=({level:n=1,...e})=>o(t,{variant:`h${n}`,component:e.component||`h${n}`,fontWeight:600,gutterBottom:!0,...e}),r=({size:n="md",...e})=>o(t,{variant:{sm:"body2",md:"body1",lg:"subtitle1"}[n],component:e.component||"p",...e}),i=n=>o(t,{variant:"subtitle1",component:n.component||"p",fontWeight:400,color:"text.secondary",...n}),c=n=>o(t,{variant:"body2",component:n.component||"span",color:"text.disabled",...n}),m=n=>o(t,{component:n.component||"strong",fontWeight:500,display:"inline",...n}),p=n=>o(t,{variant:"caption",color:"text.secondary",component:n.component||"span",...n}),a=n=>o(t,{component:"blockquote",sx:{borderLeft:"4px solid",borderColor:"divider",pl:2,color:"text.secondary",fontStyle:"italic"},...n}),l=({children:t,sx:e})=>o(n,{component:"code",sx:{fontFamily:"monospace",backgroundColor:"grey.100",color:"primary.main",px:.5,py:.25,borderRadius:1,fontSize:"0.875rem",...e},children:t});export{a as Blockquote,p as Caption,l as Code,e as Heading,i as Lead,c as Muted,m as Strong,r as Text};

package/dist/Typography/index.js

@@ -1,66 +1 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var material = require('@mui/material');
-
-const Heading = ({ level = 1, ...props }) => {
-    const variant = `h${level}`;
-    return (jsxRuntime.jsx(material.Typography, { variant: variant, component: props.component || `h${level}`, fontWeight: 600, gutterBottom: true, ...props }));
-};
-
-const Text = ({ size = 'md', ...props }) => {
-    const variantMap = {
-        sm: 'body2',
-        md: 'body1',
-        lg: 'subtitle1',
-    };
-    return (jsxRuntime.jsx(material.Typography, { variant: variantMap[size], component: props.component || 'p', ...props }));
-};
-
-const Lead = (props) => {
-    return (jsxRuntime.jsx(material.Typography, { variant: "subtitle1", component: props.component || 'p', fontWeight: 400, color: "text.secondary", ...props }));
-};
-
-const Muted = (props) => {
-    return (jsxRuntime.jsx(material.Typography, { variant: "body2", component: props.component || 'span', color: "text.disabled", ...props }));
-};
-
-const Strong = (props) => {
-    return (jsxRuntime.jsx(material.Typography, { component: props.component || 'strong', fontWeight: 500, display: "inline", ...props }));
-};
-
-const Caption = (props) => {
-    return (jsxRuntime.jsx(material.Typography, { variant: "caption", color: "text.secondary", component: props.component || 'span', ...props }));
-};
-
-const Blockquote = (props) => {
-    return (jsxRuntime.jsx(material.Typography, { component: "blockquote", sx: {
-            borderLeft: '4px solid',
-            borderColor: 'divider',
-            pl: 2,
-            color: 'text.secondary',
-            fontStyle: 'italic',
-        }, ...props }));
-};
-
-const Code = ({ children, sx }) => {
-    return (jsxRuntime.jsx(material.Box, { component: "code", sx: {
-            fontFamily: 'monospace',
-            backgroundColor: 'grey.100',
-            color: 'primary.main',
-            px: 0.5,
-            py: 0.25,
-            borderRadius: 1,
-            fontSize: '0.875rem',
-            ...sx,
-        }, children: children }));
-};
-
-exports.Blockquote = Blockquote;
-exports.Caption = Caption;
-exports.Code = Code;
-exports.Heading = Heading;
-exports.Lead = Lead;
-exports.Muted = Muted;
-exports.Strong = Strong;
-exports.Text = Text;
+"use strict";var o=require("react/jsx-runtime"),t=require("@mui/material");exports.Blockquote=e=>o.jsx(t.Typography,{component:"blockquote",sx:{borderLeft:"4px solid",borderColor:"divider",pl:2,color:"text.secondary",fontStyle:"italic"},...e}),exports.Caption=e=>o.jsx(t.Typography,{variant:"caption",color:"text.secondary",component:e.component||"span",...e}),exports.Code=({children:e,sx:n})=>o.jsx(t.Box,{component:"code",sx:{fontFamily:"monospace",backgroundColor:"grey.100",color:"primary.main",px:.5,py:.25,borderRadius:1,fontSize:"0.875rem",...n},children:e}),exports.Heading=({level:e=1,...n})=>{const r=`h${e}`;return o.jsx(t.Typography,{variant:r,component:n.component||`h${e}`,fontWeight:600,gutterBottom:!0,...n})},exports.Lead=e=>o.jsx(t.Typography,{variant:"subtitle1",component:e.component||"p",fontWeight:400,color:"text.secondary",...e}),exports.Muted=e=>o.jsx(t.Typography,{variant:"body2",component:e.component||"span",color:"text.disabled",...e}),exports.Strong=e=>o.jsx(t.Typography,{component:e.component||"strong",fontWeight:500,display:"inline",...e}),exports.Text=({size:e="md",...n})=>o.jsx(t.Typography,{variant:{sm:"body2",md:"body1",lg:"subtitle1"}[e],component:n.component||"p",...n});