@flikk/ui 1.0.0-beta.12 → 1.0.0-beta.14

package/dist/components/forms/RichTextEditor/RichTextEditor.js

@@ -540,11 +540,11 @@ const RichTextEditor = React__default.forwardRef(({ size = "md", state = "defaul
         };
         switch (tool) {
             case "bold":
-                return (jsx(Button, { size: "sm", color: "neutral", variant: "ghost", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), "data-state": isActive ? "active" : "inactive", "data-pressed": isActive ? "true" : "false", onMouseDown: handleMouseDown, onClick: handleBold, disabled: isDisabled, "aria-label": "Bold", "aria-pressed": isActive ? "true" : "false", children: jsx(BoldIcon, { className: "w-4 h-4" }) }, index));
+                return (jsx(Button, { size: "sm", color: "neutral", variant: "soft", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), "data-state": isActive ? "active" : "inactive", "data-pressed": isActive ? "true" : "false", onMouseDown: handleMouseDown, onClick: handleBold, disabled: isDisabled, "aria-label": "Bold", "aria-pressed": isActive ? "true" : "false", children: jsx(BoldIcon, { className: "w-4 h-4" }) }, index));
             case "italic":
-                return (jsx(Button, { size: "sm", color: "neutral", variant: "ghost", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), "data-state": isActive ? "active" : "inactive", "data-pressed": isActive ? "true" : "false", onMouseDown: handleMouseDown, onClick: handleItalic, disabled: isDisabled, "aria-label": "Italic", "aria-pressed": isActive ? "true" : "false", children: jsx(ItalicIcon, { className: "w-4 h-4" }) }, index));
+                return (jsx(Button, { size: "sm", color: "neutral", variant: "soft", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), "data-state": isActive ? "active" : "inactive", "data-pressed": isActive ? "true" : "false", onMouseDown: handleMouseDown, onClick: handleItalic, disabled: isDisabled, "aria-label": "Italic", "aria-pressed": isActive ? "true" : "false", children: jsx(ItalicIcon, { className: "w-4 h-4" }) }, index));
             case "underline":
-                return (jsx(Button, { size: "sm", color: "neutral", variant: "ghost", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), "data-state": isActive ? "active" : "inactive", "data-pressed": isActive ? "true" : "false", onMouseDown: handleMouseDown, onClick: handleUnderline, disabled: isDisabled, "aria-label": "Underline", "aria-pressed": isActive ? "true" : "false", children: jsx(UnderlineIcon, { className: "w-4 h-4" }) }, index));
+                return (jsx(Button, { size: "sm", color: "neutral", variant: "soft", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), "data-state": isActive ? "active" : "inactive", "data-pressed": isActive ? "true" : "false", onMouseDown: handleMouseDown, onClick: handleUnderline, disabled: isDisabled, "aria-label": "Underline", "aria-pressed": isActive ? "true" : "false", children: jsx(UnderlineIcon, { className: "w-4 h-4" }) }, index));
             case "fontSize": {
                 const currentOption = getFontSizeOption(formattingState.fontSize);
                 const dropdownClassName = themeStyles.dropdownStyle;
@@ -584,7 +584,7 @@ const RichTextEditor = React__default.forwardRef(({ size = "md", state = "defaul
                         fontSizePortalContentRef.current = null;
                     }
                 }
-                return (jsxs("div", { className: "relative", "data-tool": "fontSize", children: [jsx(Button, { ref: fontSizeTriggerRef, size: "sm", color: "neutral", variant: "ghost", className: cn(themeStyles.toolbarButtonStyle, "px-2 min-w-[3rem] gap-1"), "data-state": isActive ? "active" : "inactive", "data-pressed": isActive ? "true" : "false", onMouseDown: handleMouseDown, onClick: (event) => {
+                return (jsxs("div", { className: "relative", "data-tool": "fontSize", children: [jsx(Button, { ref: fontSizeTriggerRef, size: "sm", color: "neutral", variant: "soft", className: cn(themeStyles.toolbarButtonStyle, "px-2 min-w-[3rem] gap-1"), "data-state": isActive ? "active" : "inactive", "data-pressed": isActive ? "true" : "false", onMouseDown: handleMouseDown, onClick: (event) => {
                                 event.preventDefault();
                                 event.stopPropagation();
                                 focusEditor();
@@ -629,7 +629,7 @@ const RichTextEditor = React__default.forwardRef(({ size = "md", state = "defaul
                             colorPortalContentRef.current = null;
                         }
                     }
-                    return (jsxs("div", { className: "relative", "data-tool": "textColor", children: [jsx(Button, { ref: colorTriggerRef, size: "sm", color: "neutral", variant: "ghost", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), onMouseDown: handleMouseDown, onClick: (event) => {
+                    return (jsxs("div", { className: "relative", "data-tool": "textColor", children: [jsx(Button, { ref: colorTriggerRef, size: "sm", color: "neutral", variant: "soft", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), onMouseDown: handleMouseDown, onClick: (event) => {
                                     event.preventDefault();
                                     event.stopPropagation();
                                     focusEditor();
@@ -638,27 +638,27 @@ const RichTextEditor = React__default.forwardRef(({ size = "md", state = "defaul
                                 }, disabled: isDisabled, "aria-label": "Text Color", "aria-expanded": showColorPicker, children: jsx(PaintBrushIcon, { className: "w-4 h-4" }) }), isFloatingToolbar ? null : renderedColorDropdown, isFloatingToolbar ? renderedColorDropdown : null] }, index));
                 }
             case "alignLeft":
-                return (jsx(Button, { size: "sm", color: "neutral", variant: "ghost", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), "data-state": isActive ? "active" : "inactive", "data-pressed": isActive ? "true" : "false", onMouseDown: handleMouseDown, onClick: (event) => {
+                return (jsx(Button, { size: "sm", color: "neutral", variant: "soft", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), "data-state": isActive ? "active" : "inactive", "data-pressed": isActive ? "true" : "false", onMouseDown: handleMouseDown, onClick: (event) => {
                         event.preventDefault();
                         event.stopPropagation();
                         handleAlign("left");
                     }, disabled: isDisabled, "aria-label": "Align Left", "aria-pressed": isActive ? "true" : "false", children: jsx(Bars3BottomLeftIcon, { className: "w-4 h-4" }) }, index));
             case "alignCenter":
-                return (jsx(Button, { size: "sm", color: "neutral", variant: "ghost", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), "data-state": isActive ? "active" : "inactive", "data-pressed": isActive ? "true" : "false", onMouseDown: handleMouseDown, onClick: (event) => {
+                return (jsx(Button, { size: "sm", color: "neutral", variant: "soft", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), "data-state": isActive ? "active" : "inactive", "data-pressed": isActive ? "true" : "false", onMouseDown: handleMouseDown, onClick: (event) => {
                         event.preventDefault();
                         event.stopPropagation();
                         handleAlign("center");
                     }, disabled: isDisabled, "aria-label": "Align Center", "aria-pressed": isActive ? "true" : "false", children: jsx(Bars3Icon, { className: "w-4 h-4" }) }, index));
             case "alignRight":
-                return (jsx(Button, { size: "sm", color: "neutral", variant: "ghost", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), "data-state": isActive ? "active" : "inactive", "data-pressed": isActive ? "true" : "false", onMouseDown: handleMouseDown, onClick: (event) => {
+                return (jsx(Button, { size: "sm", color: "neutral", variant: "soft", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), "data-state": isActive ? "active" : "inactive", "data-pressed": isActive ? "true" : "false", onMouseDown: handleMouseDown, onClick: (event) => {
                         event.preventDefault();
                         event.stopPropagation();
                         handleAlign("right");
                     }, disabled: isDisabled, "aria-label": "Align Right", "aria-pressed": isActive ? "true" : "false", children: jsx(Bars3BottomRightIcon, { className: "w-4 h-4" }) }, index));
             case "undo":
-                return (jsx(Button, { size: "sm", color: "neutral", variant: "ghost", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), onMouseDown: handleMouseDown, onClick: handleUndo, disabled: isDisabled, "aria-label": "Undo", children: jsx(ArrowUturnLeftIcon, { className: "w-4 h-4" }) }, index));
+                return (jsx(Button, { size: "sm", color: "neutral", variant: "soft", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), onMouseDown: handleMouseDown, onClick: handleUndo, disabled: isDisabled, "aria-label": "Undo", children: jsx(ArrowUturnLeftIcon, { className: "w-4 h-4" }) }, index));
             case "redo":
-                return (jsx(Button, { size: "sm", color: "neutral", variant: "ghost", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), onMouseDown: handleMouseDown, onClick: handleRedo, disabled: isDisabled, "aria-label": "Redo", children: jsx(ArrowUturnRightIcon, { className: "w-4 h-4" }) }, index));
+                return (jsx(Button, { size: "sm", color: "neutral", variant: "soft", iconOnly: true, className: cn(themeStyles.toolbarButtonStyle), onMouseDown: handleMouseDown, onClick: handleRedo, disabled: isDisabled, "aria-label": "Redo", children: jsx(ArrowUturnRightIcon, { className: "w-4 h-4" }) }, index));
             case "separator":
                 return jsx("div", { className: themeStyles.separatorStyle }, index);
             default:

package/dist/index.js

@@ -84,6 +84,7 @@ export { DropdownSeparator } from './components/core/Dropdown/DropdownSeparator.
 export { DropdownTrigger } from './components/core/Dropdown/DropdownTrigger.js';
 export { Empty } from './components/core/Empty/Empty.js';
 export { Feed } from './components/data-display/Feed/Feed.js';
+export { FileTypeIcon } from './components/core/FileTypeIcon/FileTypeIcon.js';
 export { FileUpload } from './components/forms/FileUpload/FileUpload.js';
 export { FormLabel } from './components/forms/FormLabel/FormLabel.js';
 export { FunnelChart } from './components/charts/FunnelChart/FunnelChart.js';
@@ -105,7 +106,6 @@ export { Kbd } from './components/core/Kbd/Kbd.js';
 export { LINE_CHART_DEFAULTS } from './components/charts/LineChart/LineChart.types.js';
 export { LineChart } from './components/charts/LineChart/LineChart.js';
 export { Link } from './components/core/Link/Link.js';
-export { Loader } from './components/core/Loader/Loader.js';
 export { MagneticElement } from './components/effects/MagneticElement/MagneticElement.js';
 export { Masonry } from './components/core/Masonry/Masonry.js';
 export { Mention } from './components/forms/Mention/Mention.js';
@@ -152,10 +152,12 @@ export { Sidebar } from './components/core/Sidebar/Sidebar.js';
 export { SidebarContent } from './components/core/Sidebar/SidebarContent.js';
 export { SidebarFooter } from './components/core/Sidebar/SidebarFooter.js';
 export { SidebarHeader } from './components/core/Sidebar/SidebarHeader.js';
+export { SidebarMobileTrigger } from './components/core/Sidebar/SidebarMobileTrigger.js';
 export { SidebarNav } from './components/core/Sidebar/SidebarNav.js';
 export { SidebarNavGroup } from './components/core/Sidebar/SidebarNavGroup.js';
 export { SidebarSubmenu } from './components/core/Sidebar/SidebarSubmenu.js';
 export { SidebarToggle } from './components/core/Sidebar/SidebarToggle.js';
+export { SidebarUserProfile } from './components/core/Sidebar/SidebarUserProfile.js';
 export { Signature } from './components/forms/Signature/Signature.js';
 export { Skeleton } from './components/core/Skeleton/Skeleton.js';
 export { Slider } from './components/forms/Slider/Slider.js';