@vtx-ui/react 0.0.1-beta.16 → 0.0.1-beta.17

package/dist/cjs/index.js

@@ -0,0 +1,165 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_Autocomplete_Autocomplete = require('./components/Autocomplete/components/Autocomplete/Autocomplete.js');
+var components_Button_Button = require('./components/Button/components/Button/Button.js');
+var components_Checkbox_Checkbox = require('./components/Checkbox/components/Checkbox/Checkbox.js');
+var components_CheckboxGroup_CheckboxGroup = require('./components/CheckboxGroup/components/CheckboxGroup/CheckboxGroup.js');
+var components_FileUpload_FileUpload = require('./components/FileUpload/components/FileUpload/FileUpload.js');
+var components_FormControl_FormControl = require('./components/FormControl/components/FormControl/FormControl.js');
+var components_Input_Input = require('./components/Input/components/Input/Input.js');
+var components_MultiSelect_MultiSelect = require('./components/MultiSelect/components/MultiSelect/MultiSelect.js');
+var components_Radio_Radio = require('./components/Radio/components/Radio/Radio.js');
+var components_RadioGroup_RadioGroup = require('./components/RadioGroup/components/RadioGroup/RadioGroup.js');
+var components_Rating_Rating = require('./components/Rating/components/Rating/Rating.js');
+var components_RichTextEditor_RichTextEditor = require('./components/RichTextEditor/components/RichTextEditor/RichTextEditor.js');
+var components_Select_Select = require('./components/Select/components/Select/Select.js');
+var components_Skeleton_Skeleton = require('./components/Skeleton/components/Skeleton/Skeleton.js');
+var components_Skeleton_SkeletonTheme = require('./components/Skeleton/components/Skeleton/SkeletonTheme.js');
+var components_Textarea_Textarea = require('./components/Textarea/components/Textarea/Textarea.js');
+var components_DatePicker_DatePicker = require('./components/DatePicker/components/DatePicker/DatePicker.js');
+var components_DatePicker_DateRangePicker = require('./components/DatePicker/components/DatePicker/DateRangePicker.js');
+var components_DatePicker_Calendar = require('./components/DatePicker/components/DatePicker/Calendar.js');
+var components_Accordion_Accordion = require('./components/Accordion/components/Accordion/Accordion.js');
+var components_Accordion_AccordionItem = require('./components/Accordion/components/Accordion/AccordionItem.js');
+var components_Menu_ActionMenu = require('./components/Menu/components/Menu/ActionMenu.js');
+var components_Alert_Alert = require('./components/Alert/components/Alert/Alert.js');
+var components_Chip_Chip = require('./components/Chip/components/Chip/Chip.js');
+var components_Menu_Menu = require('./components/Menu/components/Menu/Menu.js');
+var components_Modal_Modal = require('./components/Modal/components/Modal/Modal.js');
+var components_Toast_Toast = require('./components/Toast/components/Toast/Toast.js');
+var components_Toast_ToastContainer = require('./components/Toast/components/Toast/ToastContainer.js');
+var components_Toast_useToast = require('./components/Toast/components/Toast/useToast.js');
+var components_ToggleButton_ToggleButton = require('./components/ToggleButton/components/ToggleButton/ToggleButton.js');
+var components_Tooltip_Tooltip = require('./components/Tooltip/components/Tooltip/Tooltip.js');
+var components_Tabs_Tabs = require('./components/Tabs/components/Tabs/Tabs.js');
+var components_Widget_Widget = require('./components/Widget/components/Widget/Widget.js');
+require('./components/Widget/components/Widget/IntelligentGrid.js');
+require('react/jsx-runtime');
+var components_Card_Card = require('./components/Card/components/Card/Card.js');
+var components_Typography_Typography = require('./components/Typography/components/Typography/Typography.js');
+var components_Badge_Badge = require('./components/Badge/components/Badge/Badge.js');
+var components_Flex_Flex = require('./components/Flex/components/Flex/Flex.js');
+require('react-icons/fi');
+require('react-icons/fa');
+var widgets_InfoCard_InfoCard = require('./widgets/InfoCard/widgets/InfoCard/InfoCard.js');
+var widgets_InfoText_InfoText = require('./widgets/InfoText/widgets/InfoText/InfoText.js');
+require('./components/Widget/renderers/components/Widget/renderers/ProductWidget.js');
+var widgets_OrderCard_OrderCard = require('./widgets/OrderCard/widgets/OrderCard/OrderCard.js');
+var components_Avatar_Avatar = require('./components/Avatar/components/Avatar/Avatar.js');
+var components_Link_Link = require('./components/Link/components/Link/Link.js');
+var components_Breadcrumb_Breadcrumb = require('./components/Breadcrumb/components/Breadcrumb/Breadcrumb.js');
+require('react');
+var theme_ThemeProvider = require('./theme/theme/ThemeProvider.js');
+require('./components/Widget/renderers/components/Widget/renderers/GridCarouselWidget.js');
+var components_AdminHeader_AdminHeader = require('./components/AdminHeader/components/AdminHeader/AdminHeader.js');
+var components_DataGrid_DataGrid = require('./components/DataGrid/components/DataGrid/DataGrid.js');
+var components_Divider_Divider = require('./components/Divider/components/Divider/Divider.js');
+var components_SideMenu_SideMenu = require('./components/SideMenu/components/SideMenu/SideMenu.js');
+var components_Table_Table = require('./components/Table/components/Table/Table.js');
+var components_Timeline_Timeline = require('./components/Timeline/components/Timeline/Timeline.js');
+var components_Image_Image = require('./components/Image/components/Image/Image.js');
+var components_Box_Box = require('./components/Box/components/Box/Box.js');
+var components_Container_Container = require('./components/Container/components/Container/Container.js');
+var components_Grid_Grid = require('./components/Grid/components/Grid/Grid.js');
+var theme_tokens = require('./theme/theme/tokens.js');
+var theme_cssVariables = require('./theme/theme/cssVariables.js');
+var hooks_index = require('./hooks/hooks/index.js');
+var widgets_ProductCard_ProductCard = require('./widgets/ProductCard/widgets/ProductCard/ProductCard.js');
+var widgets_InfoListCard_InfoListCard = require('./widgets/InfoListCard/widgets/InfoListCard/InfoListCard.js');
+var widgets_OrderConfirmation_OrderConfirmation = require('./widgets/OrderConfirmation/widgets/OrderConfirmation/OrderConfirmation.js');
+var widgets_OrderDetails_OrderDetails = require('./widgets/OrderDetails/widgets/OrderDetails/OrderDetails.js');
+var widgets_ContactForm_ContactForm = require('./widgets/ContactForm/widgets/ContactForm/ContactForm.js');
+var widgets_FAQ_FAQ = require('./widgets/FAQ/widgets/FAQ/FAQ.js');
+var widgets_PricingTable_PricingTable = require('./widgets/PricingTable/widgets/PricingTable/PricingTable.js');
+var widgets_DashboardCard_DashboardCard = require('./widgets/DashboardCard/widgets/DashboardCard/DashboardCard.js');
+var components_Navbar_Navbar = require('./components/Navbar/components/Navbar/Navbar.js');
+
+
+
+exports.Autocomplete = components_Autocomplete_Autocomplete["default"];
+exports.Button = components_Button_Button["default"];
+exports.Checkbox = components_Checkbox_Checkbox["default"];
+exports.CheckboxGroup = components_CheckboxGroup_CheckboxGroup["default"];
+exports.FileUpload = components_FileUpload_FileUpload.FileUpload;
+exports.FormControl = components_FormControl_FormControl["default"];
+exports.Input = components_Input_Input["default"];
+exports.MultiSelect = components_MultiSelect_MultiSelect["default"];
+exports.Radio = components_Radio_Radio["default"];
+exports.RadioGroup = components_RadioGroup_RadioGroup["default"];
+exports.Rating = components_Rating_Rating["default"];
+exports.RichTextEditor = components_RichTextEditor_RichTextEditor["default"];
+exports.Select = components_Select_Select["default"];
+exports.Skeleton = components_Skeleton_Skeleton["default"];
+exports.SkeletonTheme = components_Skeleton_SkeletonTheme["default"];
+exports.Textarea = components_Textarea_Textarea["default"];
+exports.DatePicker = components_DatePicker_DatePicker["default"];
+exports.DateRangePicker = components_DatePicker_DateRangePicker["default"];
+exports.Calendar = components_DatePicker_Calendar.Calendar;
+exports.Accordion = components_Accordion_Accordion["default"];
+exports.AccordionItem = components_Accordion_AccordionItem["default"];
+exports.ActionMenu = components_Menu_ActionMenu["default"];
+exports.Alert = components_Alert_Alert["default"];
+exports.Chip = components_Chip_Chip["default"];
+exports.Menu = components_Menu_Menu["default"];
+exports.MenuItem = components_Menu_Menu.MenuItem;
+exports.Modal = components_Modal_Modal["default"];
+exports.Toast = components_Toast_Toast["default"];
+exports.ToastContainer = components_Toast_ToastContainer.ToastContainer;
+exports.toast = components_Toast_useToast.toast;
+exports.useToast = components_Toast_useToast.useToast;
+exports.ToggleButton = components_ToggleButton_ToggleButton["default"];
+exports.Tooltip = components_Tooltip_Tooltip["default"];
+exports.Tab = components_Tabs_Tabs.Tab;
+exports.TabList = components_Tabs_Tabs.TabList;
+exports.TabPanel = components_Tabs_Tabs.TabPanel;
+exports.TabPanels = components_Tabs_Tabs.TabPanels;
+exports.Tabs = components_Tabs_Tabs.Tabs;
+exports.Widget = components_Widget_Widget["default"];
+exports.Card = components_Card_Card["default"];
+exports.Typography = components_Typography_Typography["default"];
+exports.Badge = components_Badge_Badge["default"];
+exports.Flex = components_Flex_Flex["default"];
+exports.InfoCard = widgets_InfoCard_InfoCard.InfoCard;
+exports.InfoText = widgets_InfoText_InfoText.InfoText;
+exports.OrderCard = widgets_OrderCard_OrderCard["default"];
+exports.Avatar = components_Avatar_Avatar["default"];
+exports.Link = components_Link_Link["default"];
+exports.Breadcrumb = components_Breadcrumb_Breadcrumb["default"];
+exports.ThemeProvider = theme_ThemeProvider.ThemeProvider;
+exports.useThemeContext = theme_ThemeProvider.useThemeContext;
+exports.AdminHeader = components_AdminHeader_AdminHeader["default"];
+exports.DataGrid = components_DataGrid_DataGrid["default"];
+exports.Divider = components_Divider_Divider["default"];
+exports.SideMenu = components_SideMenu_SideMenu["default"];
+exports.SideMenuItem = components_SideMenu_SideMenu.SideMenuItem;
+exports.Table = components_Table_Table["default"];
+exports.Timeline = components_Timeline_Timeline["default"];
+exports.Image = components_Image_Image["default"];
+exports.Box = components_Box_Box["default"];
+exports.Container = components_Container_Container["default"];
+exports.Grid = components_Grid_Grid["default"];
+exports.createCustomTokens = theme_tokens.createCustomTokens;
+exports.generateColorShades = theme_tokens.generateColorShades;
+exports.normalizeColors = theme_tokens.normalizeColors;
+exports.tokens = theme_tokens.tokens;
+exports.generateCSSVariables = theme_cssVariables.generateCSSVariables;
+exports.injectCSSVariables = theme_cssVariables.injectCSSVariables;
+exports.useBodyScrollLock = hooks_index.useBodyScrollLock;
+exports.useClickOutside = hooks_index.useClickOutside;
+exports.useDebounce = hooks_index.useDebounce;
+exports.useEscapeKey = hooks_index.useEscapeKey;
+exports.useFocusTrap = hooks_index.useFocusTrap;
+exports.useId = hooks_index.useId;
+exports.ProductCard = widgets_ProductCard_ProductCard.ProductCard;
+exports.InfoListCard = widgets_InfoListCard_InfoListCard["default"];
+exports.OrderConfirmation = widgets_OrderConfirmation_OrderConfirmation["default"];
+exports.OrderDetails = widgets_OrderDetails_OrderDetails["default"];
+exports.ContactForm = widgets_ContactForm_ContactForm["default"];
+exports.FAQ = widgets_FAQ_FAQ["default"];
+exports.PricingTable = widgets_PricingTable_PricingTable["default"];
+exports.DashboardCard = widgets_DashboardCard_DashboardCard.DashboardCard;
+exports.Header = components_Navbar_Navbar.Navbar;
+exports.Navbar = components_Navbar_Navbar.Navbar;
+//# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/theme/theme/ThemeProvider.js

@@ -0,0 +1,95 @@
+"use client";
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var theme_cssVariables = require('./cssVariables.js');
+var theme_tokens = require('./tokens.js');
+var components_Toast_ToastContainer = require('../../components/Toast/components/Toast/ToastContainer.js');
+var utils_parseClass = require('../../utils/utils/parseClass.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+const ThemeContext = React__default["default"].createContext(undefined);
+const ThemeProvider = React__default["default"].forwardRef(({ children, initialMode = 'light', customTokens, defaultSize = 'md', colorContrast, toastPosition = 'top-right', toastLimit = 5, disableToasts = false, linkComponent, imageComponent, ...props }, ref) => {
+    const [mode, setMode] = React__default["default"].useState(initialMode);
+    const [size, setDefaultSize] = React__default["default"].useState(defaultSize);
+    // Default color contrast configuration
+    const defaultColorContrast = {
+        primary: 'dark', // Dark background → needs light text
+        secondary: 'dark', // Dark background → needs light text
+        outline: 'light', // Transparent/light background → needs dark text
+        ghost: 'light', // Transparent/light background → needs dark text
+        danger: 'dark', // Dark background → needs light text
+        success: 'dark', // Dark background → needs light text
+        warning: 'dark', // Dark background → needs light text
+        info: 'dark', // Dark background → needs light text
+    };
+    const theme = React__default["default"].useMemo(() => {
+        const contrastConfig = { ...defaultColorContrast, ...colorContrast };
+        if (!customTokens) {
+            return {
+                tokens: theme_tokens.tokens,
+                mode,
+                defaultSize: size,
+                colorContrast: contrastConfig,
+                linkComponent,
+                imageComponent: imageComponent || 'img',
+            };
+        }
+        // If customTokens.colors is present, normalize it
+        let mergedTokens = { ...theme_tokens.tokens, ...customTokens };
+        if (customTokens.colors) {
+            mergedTokens.colors = {
+                ...theme_tokens.tokens.colors,
+                ...theme_tokens.normalizeColors(customTokens.colors)
+            };
+        }
+        return {
+            tokens: mergedTokens,
+            mode,
+            defaultSize: size,
+            colorContrast: contrastConfig,
+            linkComponent,
+            imageComponent: imageComponent || 'img',
+        };
+    }, [customTokens, mode, size, colorContrast, linkComponent, imageComponent]);
+    React__default["default"].useEffect(() => {
+        document.documentElement.setAttribute('data-theme', mode);
+        if (customTokens) {
+            theme_cssVariables.injectCSSVariables(theme.tokens);
+        }
+        // Initialize global parseClass styles (safe to call multiple times)
+        utils_parseClass.initGlobalStyles();
+    }, [mode, customTokens, theme.tokens]);
+    const contextValue = React__default["default"].useMemo(() => ({ theme, setMode, setDefaultSize }), [theme]);
+    return (jsxRuntime.jsx(ThemeContext.Provider, { value: contextValue, children: jsxRuntime.jsx(components_Toast_ToastContainer.ToastContainer, { position: toastPosition, limit: toastLimit, children: jsxRuntime.jsx("div", { ref: ref, ...props, children: children }) }) }));
+});
+ThemeProvider.displayName = 'ThemeProvider';
+/**
+ * Hook to access the current theme and theme utilities
+ *
+ * @throws {Error} If used outside of ThemeProvider
+ *
+ * @example
+ * function MyComponent() {
+ *   const { theme, setMode } = useThemeContext();
+ *   return <div style={{ color: theme.tokens.colors.primary[500] }}>Hello</div>;
+ * }
+ */
+const useThemeContext = () => {
+    const context = React__default["default"].useContext(ThemeContext);
+    if (!context) {
+        throw new Error('useThemeContext must be used within a ThemeProvider');
+    }
+    return context;
+};
+
+exports.ThemeProvider = ThemeProvider;
+exports["default"] = ThemeProvider;
+exports.useThemeContext = useThemeContext;
+//# sourceMappingURL=ThemeProvider.js.map

package/dist/cjs/theme/theme/ThemeProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeProvider.js","sources":["../../../../src/theme/ThemeProvider.tsx"],"sourcesContent":[null],"names":["React","tokens","normalizeColors","injectCSSVariables","initGlobalStyles","_jsx","ToastContainer"],"mappings":"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"}

package/dist/cjs/theme/theme/cssVariables.js

@@ -0,0 +1,91 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var theme_tokens = require('./tokens.js');
+
+/**
+ * Generates CSS variables from design tokens
+ * @param customTokens - Optional custom tokens to use instead of defaults
+ * @returns CSS variable declarations as a string
+ */
+function generateCSSVariables(customTokens) {
+    const tokensToUse = customTokens || theme_tokens.tokens;
+    const cssVars = [];
+    // Colors
+    Object.entries(tokensToUse.colors).forEach(([colorName, shades]) => {
+        if (typeof shades === 'object') {
+            Object.entries(shades).forEach(([shade, value]) => {
+                cssVars.push(`  --vtx-color-${colorName}-${shade}: ${value};`);
+            });
+        }
+        else {
+            cssVars.push(`  --vtx-color-${colorName}: ${shades};`);
+        }
+    });
+    // Spacing
+    Object.entries(tokensToUse.spacing).forEach(([key, value]) => {
+        cssVars.push(`  --vtx-spacing-${key}: ${value};`);
+    });
+    // Typography
+    Object.entries(tokensToUse.typography.fontFamily).forEach(([key, value]) => {
+        cssVars.push(`  --vtx-font-family-${key}: ${value};`);
+    });
+    Object.entries(tokensToUse.typography.fontSize).forEach(([key, value]) => {
+        cssVars.push(`  --vtx-font-size-${key}: ${value};`);
+    });
+    Object.entries(tokensToUse.typography.fontWeight).forEach(([key, value]) => {
+        cssVars.push(`  --vtx-font-weight-${key}: ${value};`);
+    });
+    Object.entries(tokensToUse.typography.lineHeight).forEach(([key, value]) => {
+        cssVars.push(`  --vtx-line-height-${key}: ${value};`);
+    });
+    Object.entries(tokensToUse.typography.letterSpacing).forEach(([key, value]) => {
+        cssVars.push(`  --vtx-letter-spacing-${key}: ${value};`);
+    });
+    // Text variants
+    Object.entries(tokensToUse.typography.textVariants).forEach(([variant, props]) => {
+        Object.entries(props).forEach(([prop, value]) => {
+            const propName = prop.replace(/([A-Z])/g, '-$1').toLowerCase();
+            cssVars.push(`  --vtx-text-${variant}-${propName}: ${value};`);
+        });
+    });
+    // Border radius
+    Object.entries(tokensToUse.borderRadius).forEach(([key, value]) => {
+        cssVars.push(`  --vtx-radius-${key}: ${value};`);
+    });
+    // Shadows
+    Object.entries(tokensToUse.shadows).forEach(([key, value]) => {
+        cssVars.push(`  --vtx-shadow-${key}: ${value};`);
+    });
+    // Transitions
+    Object.entries(tokensToUse.transitions).forEach(([key, value]) => {
+        cssVars.push(`  --vtx-transition-${key}: ${value};`);
+    });
+    // Z-index
+    Object.entries(tokensToUse.zIndex).forEach(([key, value]) => {
+        cssVars.push(`  --vtx-z-${key}: ${value};`);
+    });
+    return cssVars.join('\n');
+}
+/**
+ * Injects CSS variables into the document
+ * @param customTokens - Optional custom tokens to use instead of defaults
+ */
+function injectCSSVariables(customTokens) {
+    if (typeof document === 'undefined')
+        return;
+    const styleId = 'vtx-ui-variables';
+    let styleEl = document.getElementById(styleId);
+    if (!styleEl) {
+        styleEl = document.createElement('style');
+        styleEl.id = styleId;
+        document.head.appendChild(styleEl);
+    }
+    const cssVariables = generateCSSVariables(customTokens);
+    styleEl.textContent = `:root {\n${cssVariables}\n}`;
+}
+
+exports.generateCSSVariables = generateCSSVariables;
+exports.injectCSSVariables = injectCSSVariables;
+//# sourceMappingURL=cssVariables.js.map

package/dist/cjs/theme/theme/cssVariables.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cssVariables.js","sources":["../../../../src/theme/cssVariables.ts"],"sourcesContent":[null],"names":["tokens"],"mappings":"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"}

package/dist/cjs/theme/theme/index.js

@@ -0,0 +1,19 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var theme_ThemeProvider = require('./ThemeProvider.js');
+var theme_tokens = require('./tokens.js');
+var theme_cssVariables = require('./cssVariables.js');
+
+
+
+exports.ThemeProvider = theme_ThemeProvider.ThemeProvider;
+exports.useThemeContext = theme_ThemeProvider.useThemeContext;
+exports.createCustomTokens = theme_tokens.createCustomTokens;
+exports.generateColorShades = theme_tokens.generateColorShades;
+exports.normalizeColors = theme_tokens.normalizeColors;
+exports.tokens = theme_tokens.tokens;
+exports.generateCSSVariables = theme_cssVariables.generateCSSVariables;
+exports.injectCSSVariables = theme_cssVariables.injectCSSVariables;
+//# sourceMappingURL=index.js.map

package/dist/cjs/theme/theme/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}