@soul-refiner/design-system 0.2.76 → 0.2.78

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

@@ -2,6 +2,8 @@ import React from 'react';
 import styled from 'styled-components';
 import { insertImage, useLinkToolbarButton, useLinkToolbarButtonState, useListToolbarButton, useListToolbarButtonState, useMarkToolbarButton, useMarkToolbarButtonState, usePlateEditorRef, } from '@udecode/plate';
 import { Tooltip } from '../../';
+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';
 export const EditorBar = ({ handleUploadImage }) => {
@@ -43,6 +45,13 @@ export const EditorBar = ({ handleUploadImage }) => {
                 React.createElement(MenuButton, { "$active": false, onClick: handleRedo },
                     React.createElement(Redo, { size: 24, color: "grey-5" })))),
         React.createElement(Divider, null),
+        React.createElement(MenuSection, null,
+            React.createElement(StyleDropdown, { editorRef: editorRef })),
+        React.createElement(Divider, null),
+        React.createElement(MenuSection, null,
+            React.createElement(MenuButton, { "$active": false, as: "div" },
+                React.createElement(AlignmentDropdown, { editorRef: editorRef }))),
+        React.createElement(Divider, null),
         React.createElement(MenuSection, null,
             React.createElement(Tooltip, { content: "Bold", place: "top" },
                 React.createElement(MenuButton, { "$active": currBold, onClick: handleBold },

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

@@ -26,9 +26,15 @@ export const SimpleEditor = ({ editable, handleUploadImage, onChange, placeholde
                     } })))));
 };
 const InnerWrapper = styled.div `
-  padding: 24px;
-  min-height: 224px;
-  box-sizing: border-box;
+  & > div {
+    padding: 24px;
+    min-height: 224px;
+    box-sizing: border-box;
+
+    & > div {
+      margin: 24px 0px;
+    }
+  }
 `;
 const Wrapper = styled.div `
   position: relative;
@@ -61,6 +67,7 @@ const Wrapper = styled.div `
   }
 
   li {
+    margin: 8px 0px;
     color: var(--color-grey-3);
   }
 

package/dist/components/input/filter/filter.d.ts

@@ -17,9 +17,10 @@ export interface FilterProps {
     optionOnChange?: (event: React.MouseEvent) => void;
     checkbox?: boolean;
     applyOnClick?: (event: React.MouseEvent) => void;
+    resetOnClick?: (event: React.MouseEvent) => void;
 }
 declare const Filter: {
-    ({ closeOnBlur, disabled, graphic, label, sx, triggerType, options, defaultValue, closeOnChange, optionOnChange, checkbox, applyOnClick, }: FilterProps): React.JSX.Element;
+    ({ closeOnBlur, disabled, graphic, label, sx, triggerType, options, defaultValue, closeOnChange, optionOnChange, checkbox, applyOnClick, resetOnClick, }: FilterProps): React.JSX.Element;
     Trigger: {
         ({ disabled, graphic, label, onClick, open, type, value, }: FilterTriggerProps): React.JSX.Element;
         displayName: string;

package/dist/components/input/filter/filter.js

@@ -5,7 +5,7 @@ import { Box, Button, P } from '../../';
 import { ChevronDown, ChevronUp } from '../../../icons';
 import { Styles } from '../../../common';
 import { Spacer, Option } from './filter_option';
-const Filter = ({ closeOnBlur = true, disabled, graphic, label = '', sx, triggerType, options, defaultValue = '', closeOnChange = true, optionOnChange, checkbox, applyOnClick, }) => {
+const Filter = ({ closeOnBlur = true, disabled, graphic, label = '', sx, triggerType, options, defaultValue = '', closeOnChange = true, optionOnChange, checkbox, applyOnClick, resetOnClick, }) => {
     const multiple = !!checkbox;
     const wrapperRef = React.useRef(null);
     const optionsRef = React.useRef(null);
@@ -102,7 +102,8 @@ const Filter = ({ closeOnBlur = true, disabled, graphic, label = '', sx, trigger
             React.createElement(React.Fragment, null,
                 dropdownOptions,
                 triggerType === 'pill' && (React.createElement(Box, { "$display": "flex", "$dir": "row", "$align": "center", "$justify": "flex-end", "$gap": 8, sx: "margin-top: 8px; padding-right: 8px; padding-bottom: 8px" },
-                    React.createElement(Button, { onClick: () => {
+                    React.createElement(Button, { onClick: (event) => {
+                            resetOnClick && resetOnClick(event);
                             setSelected(multiple ? [] : '');
                             setOpen(false);
                         }, size: "small", type: "text" }, "Reset"),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@soul-refiner/design-system",
-  "version": "0.2.76",
+  "version": "0.2.78",
   "main": "dist/index.js",
   "license": "MIT",
   "publishConfig": {