@soul-refiner/design-system 1.7.20 → 1.7.22-alpha.0

package/dist/components/editor/navbar/navbar.js

@@ -1,12 +1,34 @@
 import React from 'react';
 import styled from 'styled-components';
 import { getPluginType, insertNodes, insertTable, toggleNodeType, useLinkToolbarButton, useLinkToolbarButtonState, useListToolbarButton, useListToolbarButtonState, useMarkToolbarButton, useMarkToolbarButtonState, useEditorRef, useEditorState, } from '@udecode/plate';
-import { Tooltip } from '../../';
-import { Bold, FileCode, Grid, Headphones, Image, Italic, Link, ListOrdered, ListUnordered, Quote, Redo, Strikethrough, Underline, Undo, Video, } from '../../../icons';
-import { ELEMENT_BLOCKQUOTE, ELEMENT_BUTTON, ELEMENT_OL, ELEMENT_UL, MARK_BOLD, MARK_CODE, MARK_ITALIC, MARK_STRIKETHROUGH, MARK_UNDERLINE, } from '../constants';
+import { Tooltip } from '../../../components/feedback/tooltip';
+import { Bold } from '../../../icons/basic/bold';
+import { FileCode } from '../../../icons/file/file_code';
+import { Grid } from '../../../icons/layout/grid';
+import { Headphones } from '../../../icons/audio_video/headphones';
+import { Image } from '../../../icons/basic/image';
+import { Italic } from '../../../icons/basic/italic';
+import { Link } from '../../../icons/basic/link';
+import { ListOrdered } from '../../../icons/text/list_ordered';
+import { ListUnordered } from '../../../icons/text/list_unordered';
+import { Quote } from '../../../icons/text/quote';
+import { Redo } from '../../../icons/arrow/redo';
+import { Strikethrough } from '../../../icons/basic/strikethrough';
+import { Underline } from '../../../icons/basic/underline';
+import { Undo } from '../../../icons/arrow/undo';
+import { Video } from '../../../icons/basic/video';
+import { ELEMENT_BLOCKQUOTE } from '../constants';
+import { ELEMENT_BUTTON } from '../constants';
+import { ELEMENT_OL } from '../constants';
+import { ELEMENT_UL } from '../constants';
+import { MARK_BOLD } from '../constants';
+import { MARK_CODE } from '../constants';
+import { MARK_ITALIC } from '../constants';
+import { MARK_STRIKETHROUGH } from '../constants';
+import { MARK_UNDERLINE } from '../constants';
+import { StyleDropdown } from './style_dropdown';
 import { AlignmentDropdown } from './alignment_dropdown';
 import { ButtonModal } from './button_modal';
-import { StyleDropdown } from './style_dropdown';
 export const EditorBar = () => {
     const editorRef = useEditorRef('main');
     const stateEditor = useEditorState();

package/dist/components/editor/navbar/style_dropdown.js

@@ -1,7 +1,14 @@
 import React from 'react';
 import { findNode, isBlock, isCollapsed, toggleNodeType, } from '@udecode/plate';
-import { Button, Dropdown } from '../../';
-import { ELEMENT_H1, ELEMENT_H2, ELEMENT_H3, ELEMENT_H4, ELEMENT_H5, ELEMENT_H6, ELEMENT_PARAGRAPH, } from '../constants';
+import { Button } from '../../../components/actions/button/button';
+import { Dropdown } from '../../../components/actions/dropdown/dropdown';
+import { ELEMENT_H1 } from '../constants';
+import { ELEMENT_H2 } from '../constants';
+import { ELEMENT_H3 } from '../constants';
+import { ELEMENT_H4 } from '../constants';
+import { ELEMENT_H5 } from '../constants';
+import { ELEMENT_H6 } from '../constants';
+import { ELEMENT_PARAGRAPH } from '../constants';
 const items = [
     {
         value: ELEMENT_PARAGRAPH,

package/dist/components/editor/plugins/blocks/blockquote.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { PlateElement, } from '@udecode/plate';
-import { P } from '../../../atoms/typography';
+import { P } from '../../../../components/atoms/typography/paragraph';
 export const BlockquoteElement = React.forwardRef(({ children, ...props }, ref) => {
     return (React.createElement(PlateElement, { asChild: true, ref: ref, ...props },
         React.createElement(React.Fragment, null,

package/dist/components/editor/plugins/blocks/blocks.d.ts

@@ -1 +1 @@
-export declare const blocks: (import("@udecode/plate-core").PlatePlugin<import("@udecode/utils").AnyObject, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-core").HotkeyPlugin, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-code-block").CodeBlockPlugin, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-heading").HeadingsPlugin, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-media").ImagePlugin, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-indent").IndentPlugin, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-indent-list").IndentListPlugin, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-media").MediaPlugin, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-reset-node").ResetNodePlugin<import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>>, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-table").TablePlugin<import("@udecode/slate").Value>, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>>)[];
+export declare const blocks: (import("@udecode/plate-core").PlatePlugin<import("@udecode/utils").AnyObject, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-heading").HeadingsPlugin, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-media").ImagePlugin, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-indent").IndentPlugin, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-indent-list").IndentListPlugin, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-media").MediaPlugin, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-core").HotkeyPlugin, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-reset-node").ResetNodePlugin<import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>>, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-code-block").CodeBlockPlugin, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>> | import("@udecode/plate-core").PlatePlugin<import("@udecode/plate-table").TablePlugin<import("@udecode/slate").Value>, import("@udecode/slate").Value, import("@udecode/plate-core").PlateEditor<import("@udecode/slate").Value>>)[];

package/dist/components/editor/plugins/blocks/blocks.js

@@ -1,9 +1,14 @@
-import { createBlockquotePlugin, createCodeBlockPlugin, createHeadingPlugin, createHorizontalRulePlugin, createIndentListPlugin, createImagePlugin, createTextIndentPlugin, createListPlugin, createMediaEmbedPlugin, createResetNodePlugin, createTablePlugin, } from '@udecode/plate';
+import { createBlockquotePlugin, createCodeBlockPlugin, createHeadingPlugin, createHorizontalRulePlugin, createIndentListPlugin, createImagePlugin, createTextIndentPlugin, createListPlugin, createMediaEmbedPlugin, createResetNodePlugin, createTablePlugin, ELEMENT_H1, ELEMENT_H2, ELEMENT_H3, ELEMENT_H4, ELEMENT_H5, ELEMENT_H6, ELEMENT_OL, ELEMENT_PARAGRAPH, ELEMENT_UL, } from '@udecode/plate';
+import { createParagraphPlugin } from './text';
 import { createButtonsPlugin } from './buttons';
 import { createQAPlugin } from './qa';
-import { createParagraphPlugin, createHOnePlugin, createHTwoPlugin, createHThreePlugin, createHFourPlugin, createHFivePlugin, createHSixPlugin, } from './text';
+import { createHOnePlugin } from './text';
+import { createHTwoPlugin } from './text';
+import { createHThreePlugin } from './text';
+import { createHFourPlugin } from './text';
+import { createHFivePlugin } from './text';
+import { createHSixPlugin } from './text';
 import { createVideoTitlePlugin } from './video';
-import { ELEMENT_PARAGRAPH, ELEMENT_H1, ELEMENT_H2, ELEMENT_H3, ELEMENT_H4, ELEMENT_H5, ELEMENT_H6, ELEMENT_OL, ELEMENT_UL, } from '../../constants';
 export const blocks = [
     createButtonsPlugin(),
     createBlockquotePlugin(),

package/dist/components/editor/plugins/blocks/buttons.js

@@ -1,8 +1,10 @@
 import React from 'react';
 import styled from 'styled-components';
 import { createPluginFactory, getBlockAbove, getPluginType, isEditorReadOnly, setNodes, someNode, PlateElement, } from '@udecode/plate';
-import { Button as UIButton } from '../../..';
-import { COLORS, ELEMENT_BUTTON, ELEMENT_PARAGRAPH } from '../../constants';
+import { Button as UIButton } from '../../../../components';
+import { COLORS } from '../../constants';
+import { ELEMENT_BUTTON } from '../../constants';
+import { ELEMENT_PARAGRAPH } from '../../constants';
 export const Button = React.forwardRef(({ children, editor, element, ...props }, ref) => {
     const { buttonType, color } = element;
     const pressed = !!editor?.selection &&

package/dist/components/editor/plugins/blocks/image.js

@@ -3,9 +3,11 @@ import { cn, withRef } from '@udecode/cn';
 import { PlateElement, withHOC } from '@udecode/plate-common';
 import { ELEMENT_IMAGE, Image, useMediaState } from '@udecode/plate-media';
 import { ResizableProvider } from '@udecode/plate-resizable';
-import { MediaPopover } from './media-popover';
-import { mediaResizeHandleVariants, Resizable, ResizeHandle, } from './resizable';
+import { Resizable } from './resizable';
+import { ResizeHandle } from './resizable';
 import { EditorContext } from '../../context';
+import { MediaPopover } from './media-popover';
+import { mediaResizeHandleVariants } from './resizable';
 export const ImageElement = withHOC(ResizableProvider, withRef(({ className, children, element, nodeProps, ...props }, ref) => {
     const { imageSrcLoader } = React.useContext(EditorContext);
     const { readOnly, focused, selected, align = 'center' } = useMediaState();

package/dist/components/editor/plugins/blocks/media-popover.js

@@ -3,7 +3,9 @@ import { isSelectionExpanded, useEditorSelector, useElement, useRemoveNodeButton
 import { floatingMediaActions, useFloatingMediaSelectors, } from '@udecode/plate-media';
 import { useReadOnly, useSelected } from 'slate-react';
 import { Button } from './plate-button';
-import { Popover, PopoverAnchor, PopoverContent } from './popover';
+import { Popover } from './popover';
+import { PopoverAnchor } from './popover';
+import { PopoverContent } from './popover';
 import { Link, Trash } from 'lucide-react';
 export function MediaPopover({ children }) {
     const readOnly = useReadOnly();

package/dist/components/editor/plugins/blocks/plate-button.d.ts

@@ -1,13 +1,13 @@
 import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
 export declare const buttonVariants: (props?: ({
-    variant?: "link" | "default" | "secondary" | "destructive" | "outline" | "ghost" | "inlineLink" | null | undefined;
-    size?: "none" | "icon" | "default" | "sm" | "xs" | "sms" | "lg" | null | undefined;
+    variant?: "link" | "default" | "secondary" | "outline" | "destructive" | "ghost" | "inlineLink" | null | undefined;
+    size?: "none" | "default" | "icon" | "sm" | "xs" | "sms" | "lg" | null | undefined;
     isMenu?: boolean | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export declare const Button: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
-    variant?: "link" | "default" | "secondary" | "destructive" | "outline" | "ghost" | "inlineLink" | null | undefined;
-    size?: "none" | "icon" | "default" | "sm" | "xs" | "sms" | "lg" | null | undefined;
+    variant?: "link" | "default" | "secondary" | "outline" | "destructive" | "ghost" | "inlineLink" | null | undefined;
+    size?: "none" | "default" | "icon" | "sm" | "xs" | "sms" | "lg" | null | undefined;
     isMenu?: boolean | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & {
     asChild?: boolean | undefined;

package/dist/components/editor/plugins/blocks/qa.js

@@ -3,10 +3,10 @@ import { createPluginFactory, PlateElement, } from '@udecode/plate';
 import styled from 'styled-components';
 import { ELEMENT_QA } from '../../constants';
 import { EditorContext } from '../../context';
-import { Button } from '../../../actions';
-import { Box } from '../../../atoms/box';
-import { HideButRender } from '../../../atoms/hide';
-import { H } from '../../../atoms/typography';
+import { Button } from '../../../../components/actions/button/button';
+import { Box } from '../../../../components/atoms/box/box';
+import { HideButRender } from '../../../../components';
+import { H } from '../../../../components/atoms/typography/heading';
 import { ChevronDown } from '../../../../icons/arrow/chevron_down';
 import { ChevronUp } from '../../../../icons/arrow/chevron_up';
 export const QuestionAnswerElement = React.forwardRef(({ children, element, ...props }, ref) => {

package/dist/components/editor/plugins/blocks/resizable.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 export declare const mediaResizeHandleVariants: (props?: ({
-    direction?: "right" | "left" | null | undefined;
+    direction?: "left" | "right" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export declare const ResizeHandle: React.ForwardRefExoticComponent<Omit<{
     as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
@@ -35,5 +35,5 @@ export declare const ResizeHandle: React.ForwardRefExoticComponent<Omit<{
 export declare const Resizable: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement> & {
     options: import("@udecode/plate-resizable").ResizableOptions;
 } & React.RefAttributes<HTMLDivElement>, "ref"> & import("class-variance-authority").VariantProps<(props?: ({
-    align?: "center" | "right" | "left" | null | undefined;
+    align?: "center" | "left" | "right" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;

package/dist/components/editor/plugins/blocks/separator.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
 export declare const Separator: import("react").ForwardRefExoticComponent<Omit<Omit<SeparatorPrimitive.SeparatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("class-variance-authority").VariantProps<(props?: ({
-    orientation?: "vertical" | "horizontal" | null | undefined;
+    orientation?: "horizontal" | "vertical" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/editor/plugins/blocks/table.js

@@ -6,10 +6,21 @@ import { useReadOnly, useSelected } from 'slate-react';
 import { PopoverAnchor } from '@radix-ui/react-popover';
 import { Combine, Trash, Ungroup } from 'lucide-react';
 import { Button } from './plate-button';
-import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuPortal, DropdownMenuTrigger, } from './dropdown-menu';
-import { Popover, PopoverContent, popoverVariants } from './popover';
+import { DropdownMenu } from './dropdown-menu';
+import { DropdownMenuCheckboxItem } from './dropdown-menu';
+import { DropdownMenuContent } from './dropdown-menu';
+import { DropdownMenuPortal } from './dropdown-menu';
+import { DropdownMenuTrigger } from './dropdown-menu';
+import { Popover } from './popover';
+import { PopoverContent } from './popover';
+import { popoverVariants } from './popover';
 import { Separator } from './separator';
-import { BorderAll, BorderBottom, BorderLeft, BorderNone, BorderRight, BorderTop, } from '../../icons';
+import { BorderAll } from '../../icons';
+import { BorderBottom } from '../../icons';
+import { BorderLeft } from '../../icons';
+import { BorderNone } from '../../icons';
+import { BorderRight } from '../../icons';
+import { BorderTop } from '../../icons';
 export const TableBordersDropdownMenuContent = withRef((props, ref) => {
     const { getOnSelectTableBorder, hasOuterBorders, hasBottomBorder, hasLeftBorder, hasNoBorders, hasRightBorder, hasTopBorder, } = useTableBordersDropdownMenuContentState();
     return (React.createElement(DropdownMenuContent, { ref: ref, className: cn('min-w-[220px]'), side: "right", align: "start", sideOffset: 0, ...props },

package/dist/components/editor/plugins/blocks/text.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { createPluginFactory, PlateElement, } from '@udecode/plate';
-import { P } from '../../../atoms/typography/paragraph';
-import { H } from '../../../atoms/typography/heading';
+import { P } from '../../../../components/atoms/typography/paragraph';
+import { H } from '../../../../components/atoms/typography/heading';
 import * as Elements from '../../constants';
 export const ParagraphElement = React.forwardRef(({ children, ...props }, ref) => {
     const textAlign = props?.style?.textAlign;

package/dist/components/editor/plugins/blocks/video.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import { createPluginFactory, isEditorReadOnly, PlateElement, } from '@udecode/plate';
-import { ELEMENT_H2, ELEMENT_VIDEO } from '../../constants';
+import { ELEMENT_H2 } from '../../constants';
+import { ELEMENT_VIDEO } from '../../constants';
 import { EditorContext } from '../../context';
 export const VideoTitleElement = React.forwardRef(function VideoTitle({ editor, element, ...props }, ref) {
     const editable = !isEditorReadOnly(editor);

package/dist/components/editor/plugins/leafs/leafs.js

@@ -1,7 +1,13 @@
 import { createAlignPlugin, createCodePlugin, createIndentPlugin, createLineHeightPlugin, } from '@udecode/plate';
 import { createLinkPlugin } from '@udecode/plate-link';
+import { ELEMENT_PARAGRAPH } from '../../constants';
+import { ELEMENT_H1 } from '../../constants';
+import { ELEMENT_H2 } from '../../constants';
+import { ELEMENT_H3 } from '../../constants';
+import { ELEMENT_H4 } from '../../constants';
+import { ELEMENT_H5 } from '../../constants';
+import { ELEMENT_H6 } from '../../constants';
 import { LinkFloatingMenu } from './link';
-import { ELEMENT_PARAGRAPH, ELEMENT_H1, ELEMENT_H2, ELEMENT_H3, ELEMENT_H4, ELEMENT_H5, ELEMENT_H6, } from '../../constants';
 export const leafs = [
     createAlignPlugin({
         inject: {

package/dist/components/editor/plugins/leafs/link.js

@@ -1,8 +1,10 @@
 import React from 'react';
 import styled from 'styled-components';
 import { FloatingLinkUrlInput, LinkOpenButton, PlateElement, useFloatingLinkEdit, useFloatingLinkEditState, useFloatingLinkInsert, useFloatingLinkInsertState, useFloatingLinkSelectors, useLink, } from '@udecode/plate';
-import { Box } from '../../..';
-import { AASansSerif, Link, Upload } from '../../../../icons';
+import { Box } from '../../../../components/atoms/box/box';
+import { AASansSerif } from '../../../../icons/basic/aa_sansserif';
+import { Link } from '../../../../icons/basic/link';
+import { Upload } from '../../../../icons/basic/upload';
 export const LinkElement = React.forwardRef(({ children, ...props }, ref) => {
     const { props: linkProps } = useLink({ element: props.element });
     return (React.createElement(PlateElement, { asChild: true, ref: ref, ...linkProps, ...props },

package/dist/components/editor/plugins/plate.js

@@ -1,15 +1,22 @@
 import { withProps } from '@udecode/cn';
 import { PlateLeaf } from '@udecode/plate-common';
+import { LinkElement } from './leafs/link';
+import * as Elements from '../constants';
 import { BlockquoteElement } from './blocks/blockquote';
 import { Button } from './blocks/buttons';
 import { ImageElement } from './blocks/image';
 import { ListElement } from './blocks/list';
 import { TableElement } from './blocks/table';
-import { TableCellElement, TableCellHeaderElement } from './blocks/table-cell';
+import { TableCellElement } from './blocks/table-cell';
+import { TableCellHeaderElement } from './blocks/table-cell';
 import { TableRowElement } from './blocks/table-row';
-import { ParagraphElement, HOneElement, HTwoElement, HThreeElement, HFourElement, HFiveElement, HSixElement, } from './blocks/text';
-import { LinkElement } from './leafs/link';
-import * as Elements from '../constants';
+import { ParagraphElement } from './blocks/text';
+import { HOneElement } from './blocks/text';
+import { HTwoElement } from './blocks/text';
+import { HThreeElement } from './blocks/text';
+import { HFourElement } from './blocks/text';
+import { HFiveElement } from './blocks/text';
+import { HSixElement } from './blocks/text';
 export const plateUI = {
     [Elements.ELEMENT_PARAGRAPH]: ParagraphElement,
     [Elements.ELEMENT_H1]: HOneElement,

package/dist/components/editor/plugins/utils/exitBreak.js

@@ -1,5 +1,10 @@
 import { KEYS_HEADING } from '@udecode/plate';
-import { ELEMENT_BLOCKQUOTE, ELEMENT_BUTTON, ELEMENT_MEDIA, ELEMENT_MEDIA_EMBED, ELEMENT_OL, ELEMENT_UL, } from '../../constants';
+import { ELEMENT_BLOCKQUOTE } from '../../constants';
+import { ELEMENT_BUTTON } from '../../constants';
+import { ELEMENT_MEDIA } from '../../constants';
+import { ELEMENT_MEDIA_EMBED } from '../../constants';
+import { ELEMENT_OL } from '../../constants';
+import { ELEMENT_UL } from '../../constants';
 export const exitBreakPlugin = {
     options: {
         rules: [

package/dist/components/editor/plugins/utils/resetBlockType.js

@@ -1,5 +1,7 @@
 import { isBlockAboveEmpty, isSelectionAtBlockStart } from '@udecode/plate';
-import { ELEMENT_BLOCKQUOTE, ELEMENT_PARAGRAPH, ELEMENT_TODO_LI, } from '../../constants';
+import { ELEMENT_BLOCKQUOTE } from '../../constants';
+import { ELEMENT_PARAGRAPH } from '../../constants';
+import { ELEMENT_TODO_LI } from '../../constants';
 const resetBlockTypesCommonRule = {
     types: [ELEMENT_BLOCKQUOTE, ELEMENT_TODO_LI],
     defaultType: ELEMENT_PARAGRAPH,

package/dist/components/editor/plugins/utils/selectOnBackspace.js

@@ -1,4 +1,6 @@
-import { ELEMENT_HR, ELEMENT_IMAGE, ELEMENT_MEDIA_EMBED, } from '../../constants';
+import { ELEMENT_HR } from '../../constants';
+import { ELEMENT_IMAGE } from '../../constants';
+import { ELEMENT_MEDIA_EMBED } from '../../constants';
 export const selectOnBackspace = {
     options: {
         query: { allow: [ELEMENT_HR, ELEMENT_IMAGE, ELEMENT_MEDIA_EMBED] },

package/dist/components/editor/simple_editor/navbar.d.ts

@@ -3,6 +3,3 @@ export interface EditorBarProps {
     handleUploadImage: (files: FileList) => Promise<string>;
 }
 export declare const EditorBar: ({ handleUploadImage }: EditorBarProps) => React.JSX.Element;
-export declare const MenuButton: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
-    $active?: boolean | undefined;
-}>>;

package/dist/components/editor/simple_editor/navbar.js

@@ -1,11 +1,24 @@
 import React from 'react';
 import styled from 'styled-components';
 import { insertImage, insertNode, useLinkToolbarButton, useLinkToolbarButtonState, useListToolbarButton, useListToolbarButtonState, useMarkToolbarButton, useMarkToolbarButtonState, useEditorRef, ELEMENT_PARAGRAPH, } from '@udecode/plate';
-import { Tooltip } from '../../';
+import { Tooltip } from '../../../components/feedback/tooltip';
 import { AlignmentDropdown } from '../navbar/alignment_dropdown';
 import { StyleDropdown } from '../navbar/style_dropdown';
-import { Bold, Image, Italic, Link, ListOrdered, ListUnordered, Redo, Underline, Undo, } from '../../../icons';
-import { ELEMENT_OL, ELEMENT_UL, MARK_BOLD, MARK_ITALIC, MARK_UNDERLINE, } from '../constants';
+import { Bold } from '../../../icons/basic/bold';
+import { Image } from '../../../icons/basic/image';
+import { Italic } from '../../../icons/basic/italic';
+import { Link } from '../../../icons/basic/link';
+import { ListOrdered } from '../../../icons/text/list_ordered';
+import { ListUnordered } from '../../../icons/text/list_unordered';
+import { Redo } from '../../../icons/arrow/redo';
+import { Underline } from '../../../icons/basic/underline';
+import { Undo } from '../../../icons/arrow/undo';
+import { ELEMENT_OL } from '../constants';
+import { ELEMENT_UL } from '../constants';
+import { MARK_BOLD } from '../constants';
+import { MARK_ITALIC } from '../constants';
+import { MARK_UNDERLINE } from '../constants';
+import { MenuButton } from '../styles/menu_button';
 export const EditorBar = ({ handleUploadImage }) => {
     const editorRef = useEditorRef('main');
     const imageRef = React.useRef(null);
@@ -104,35 +117,6 @@ const MenuSection = styled.div `
   width: fit-content;
   flex-shrink: 0;
 `;
-export const MenuButton = styled.button `
-  padding: 2px;
-  border: none;
-  outline: none;
-  cursor: pointer;
-  box-sizing: border-box;
-  height: 28px;
-  width: 28px;
-  border-radius: 2px;
-
-  &:hover:not(:disabled) {
-    padding: 1px;
-    border: 1px solid var(--color-grey-8);
-  }
-
-  &:active:not(:disabled) {
-    background-color: var(--color-grey-9);
-  }
-
-  &:disabled {
-    background-color: var(--color-white) !important;
-    cursor: initial;
-    svg {
-      fill: var(--color-grey-7) !important;
-    }
-  }
-
-  background-color: ${({ $active }) => $active ? 'var(--color-grey-9)' : 'transparent'};
-`;
 const Divider = styled.div `
   width: 1px;
   height: 28px;

package/dist/components/editor/simple_editor/plugins.js

@@ -1,12 +1,25 @@
-import { createPlugins, createHeadingPlugin, createIndentListPlugin, createImagePlugin, createTextIndentPlugin, createListPlugin, createMediaEmbedPlugin, createResetNodePlugin, createBoldPlugin, createCodePlugin, createFontBackgroundColorPlugin, createFontSizePlugin, createFontFamilyPlugin, createItalicPlugin, createStrikethroughPlugin, createSubscriptPlugin, createSuperscriptPlugin, createUnderlinePlugin, createAlignPlugin, createIndentPlugin, createLineHeightPlugin, createLinkPlugin, createExitBreakPlugin, createHistoryPlugin, createSelectOnBackspacePlugin, createSoftBreakPlugin, } from '@udecode/plate';
-import { createParagraphPlugin, createHOnePlugin, createHTwoPlugin, createHThreePlugin, createHFourPlugin, createHFivePlugin, createHSixPlugin, } from '../plugins/blocks/text';
-import { ELEMENT_PARAGRAPH, ELEMENT_H1, ELEMENT_H2, ELEMENT_H3, ELEMENT_H4, ELEMENT_H5, ELEMENT_H6, ELEMENT_OL, ELEMENT_UL, } from '../constants';
-import { exitBreakPlugin } from '../plugins/utils/exitBreak';
+import { createPlugins, createHeadingPlugin, createIndentListPlugin, createImagePlugin, createTextIndentPlugin, createListPlugin, createMediaEmbedPlugin, createResetNodePlugin, createBoldPlugin, createCodePlugin, createFontBackgroundColorPlugin, createFontSizePlugin, createFontFamilyPlugin, createItalicPlugin, createStrikethroughPlugin, createSubscriptPlugin, createSuperscriptPlugin, createUnderlinePlugin, createAlignPlugin, createIndentPlugin, createLineHeightPlugin, createLinkPlugin, createExitBreakPlugin, createHistoryPlugin, createSelectOnBackspacePlugin, createSoftBreakPlugin, createParagraphPlugin, } from '@udecode/plate';
+import { ELEMENT_PARAGRAPH } from '../constants';
+import { ELEMENT_H1 } from '../constants';
+import { ELEMENT_H2 } from '../constants';
+import { ELEMENT_H3 } from '../constants';
+import { ELEMENT_H4 } from '../constants';
+import { ELEMENT_H5 } from '../constants';
+import { ELEMENT_H6 } from '../constants';
+import { ELEMENT_OL } from '../constants';
+import { ELEMENT_UL } from '../constants';
+import { createHOnePlugin } from '../plugins/blocks/text';
+import { createHTwoPlugin } from '../plugins/blocks/text';
+import { createHThreePlugin } from '../plugins/blocks/text';
+import { createHFourPlugin } from '../plugins/blocks/text';
+import { createHFivePlugin } from '../plugins/blocks/text';
+import { createHSixPlugin } from '../plugins/blocks/text';
 import { LinkFloatingMenu } from '../plugins/leafs/link';
+import { plateUI } from '../plugins/plate';
+import { exitBreakPlugin } from '../plugins/utils/exitBreak';
 import { resetBlockTypePlugin } from '../plugins/utils/resetBlockType';
 import { selectOnBackspace } from '../plugins/utils/selectOnBackspace';
 import { softBreakPlugin } from '../plugins/utils/softBreak';
-import { plateUI } from '../plugins/plate';
 export const plugins = createPlugins([
     createHeadingPlugin(),
     createImagePlugin({

package/dist/components/editor/styles/menu_button.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export declare const MenuButton: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
+    $active?: boolean | undefined;
+}>>;

package/dist/components/editor/styles/menu_button.js

@@ -0,0 +1,31 @@
+'use client';
+import styled from 'styled-components';
+export const MenuButton = styled.button `
+  padding: 2px;
+  border: none;
+  outline: none;
+  cursor: pointer;
+  box-sizing: border-box;
+  height: 28px;
+  width: 28px;
+  border-radius: 2px;
+
+  &:hover:not(:disabled) {
+    padding: 1px;
+    border: 1px solid var(--color-grey-8);
+  }
+
+  &:active:not(:disabled) {
+    background-color: var(--color-grey-9);
+  }
+
+  &:disabled {
+    background-color: var(--color-white) !important;
+    cursor: initial;
+    svg {
+      fill: var(--color-grey-7) !important;
+    }
+  }
+
+  background-color: ${({ $active }) => $active ? 'var(--color-grey-9)' : 'transparent'};
+`;

package/dist/components/feedback/animated_toast/animated_toast.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ToastTypes } from '../toast/toast';
+import { ToastTypes } from '../../../components/feedback/toast/toast';
 export interface AnimatedToastProps {
     message: string;
     onClose?: () => void;

package/dist/components/feedback/animated_toast/animated_toast.js

@@ -1,7 +1,7 @@
 'use client';
 import React from 'react';
 import { styled } from 'styled-components';
-import { Toast } from '../toast';
+import { Toast } from '../../../components/feedback/toast/toast';
 export const AnimatedToast = ({ message, type, onClose, animationDuration = 4, }) => {
     const [toastIsClosed, setToastIsClosed] = React.useState(false);
     const timer = React.useRef(null);

package/dist/components/feedback/badge/badge.js

@@ -1,7 +1,7 @@
 'use client';
 import React from 'react';
 import styled from 'styled-components';
-import { Close } from '../../../icons';
+import { Close } from '../../../icons/basic/close';
 const colorLookup = {
     blue: {
         primary: 'var(--color-hue-blue-1)',

package/dist/components/feedback/banner/banner.js

@@ -1,9 +1,15 @@
 'use client';
 import React from 'react';
 import styled from 'styled-components';
-import { Styles } from '../../../common';
-import { Box, Button, P } from '../../';
-import { AlertCircle, AlertOctogon, AlertTriangle, Close, Information, } from '../../../icons';
+import { Styles } from '../../../common/styles';
+import { Box } from '../../../components/atoms/box/box';
+import { Button } from '../../../components/actions/button/button';
+import { P } from '../../../components/atoms/typography/paragraph';
+import { AlertCircle } from '../../../icons/notifications/alert_circle';
+import { AlertOctogon } from '../../../icons/notifications/alert_octogon';
+import { AlertTriangle } from '../../../icons/notifications/alert_triangle';
+import { Close } from '../../../icons/basic/close';
+import { Information } from '../../../icons/notifications/information';
 export const Banner = ({ content, href, onClose, title, type, setContentInNewLine = false, additionalContent, sx, }) => {
     const iconLookup = {
         error: React.createElement(AlertOctogon, { size: 24 }),

package/dist/components/feedback/chip/chip.js

@@ -1,7 +1,7 @@
 'use client';
 import React from 'react';
 import styled from 'styled-components';
-import { Close } from '../../../icons';
+import { Close } from '../../../icons/basic/close';
 const colorLookup = {
     'primary-blue': {
         primary: 'var(--color-primary-blue-2)',

package/dist/components/feedback/loader/loader.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { COLORS } from '../../../common';
+import { COLORS } from '../../../common/colors';
 export interface LoaderProps {
     color?: (typeof COLORS)[number];
     inline?: boolean;

package/dist/components/feedback/loader/loader.js

@@ -1,7 +1,7 @@
 'use client';
 import React from 'react';
 import styled, { keyframes } from 'styled-components';
-import { colorReference } from '../../../common';
+import { colorReference } from '../../../common/colors';
 export const Loader = ({ color = 'grey-1', inline, size = 16, sx, }) => {
     let borderWidth = 3;
     if (size > 96)

package/dist/components/feedback/notification/notification.js

@@ -1,9 +1,15 @@
 'use client';
 import React from 'react';
 import styled from 'styled-components';
-import { Styles } from '../../../common';
-import { Box, Button, P } from '../../';
-import { AlertCircle, AlertOctogon, AlertTriangle, Close, Information, } from '../../../icons';
+import { Styles } from '../../../common/styles';
+import { Box } from '../../../components/atoms/box/box';
+import { Button } from '../../../components/actions/button/button';
+import { P } from '../../../components/atoms/typography/paragraph';
+import { AlertCircle } from '../../../icons/notifications/alert_circle';
+import { AlertOctogon } from '../../../icons/notifications/alert_octogon';
+import { AlertTriangle } from '../../../icons/notifications/alert_triangle';
+import { Close } from '../../../icons/basic/close';
+import { Information } from '../../../icons/notifications/information';
 export const Notification = ({ content, href, onClose, sx, title, type, }) => {
     const iconLookup = {
         error: React.createElement(AlertOctogon, { size: 24 }),

package/dist/components/feedback/progress/progress.js

@@ -1,9 +1,14 @@
 'use client';
 import React from 'react';
 import styled from 'styled-components';
-import { colorReference } from '../../../common';
-import { Box, P } from '../../';
-import { CheckmarkCircle, Checkmarks, Close, MinusCircle, Pause, } from '../../../icons';
+import { colorReference } from '../../../common/colors';
+import { Box } from '../../../components/atoms/box/box';
+import { P } from '../../../components/atoms/typography/paragraph';
+import { CheckmarkCircle } from '../../../icons/basic/checkmark_circle';
+import { Checkmarks } from '../../../icons/basic/checkmarks';
+import { Close } from '../../../icons/basic/close';
+import { MinusCircle } from '../../../icons/basic/minus_circle';
+import { Pause } from '../../../icons/audio_video/pause';
 export const Progress = ({ hasError, progress, subtitle, sx, title, type, }) => {
     const isComplete = !hasError && progress > 99;
     const isDetailed = type === 'detailed';