@onereach/ui-components 2.70.0-beta.2164.0 → 2.70.0-beta.2167.0

package/dist/bundled/v3/{OrRichTextEditor.vue_vue_type_script_lang-1aa9ad53.js → OrRichTextEditor.vue_vue_type_script_lang-067e56ab.js}

@@ -1,4 +1,5 @@
 import { defineComponent, ref, onMounted, onBeforeUnmount, computed, watch } from 'vue';
+import { onClickOutside } from '@vueuse/core';
 import { S as Schema, M as Mark$1, N as NodeSelection, T as TextSelection, a as Selection, b as Slice, d as dropPoint, F as Fragment, D as DOMSerializer, c as DOMParser$1, A as AllSelection, P as Plugin, e as NodeRange, f as findWrapping, R as ReplaceAroundStep, g as canSplit, l as liftTarget, h as canJoin, i as PluginKey, E as EditorState, j as createParagraphNear$1, k as deleteSelection$1, m as exitCode$1, n as joinUp$1, o as joinDown$1, p as joinBackward$1, q as joinForward$1, r as lift$1, s as liftEmptyBlock$1, t as newlineInCode$1, u as selectNodeBackward$1, v as selectNodeForward$1, w as selectParentNode$1, x as selectTextblockEnd$1, y as selectTextblockStart$1, z as Transform, B as setBlockType, C as wrapIn$1, G as ReplaceStep, H as Mapping, I as CodeMirrorView } from './codemirrorView-77ce9187.js';
 import require$$8 from 'node:punycode';
 import { c as keyName, d as base } from './index-780d00b0.js';
@@ -28072,7 +28073,10 @@ const Toolbar = [
 'last-of-type:border-none'];
 const ToolbarButton = [
 // Typography
-'text-on-disabled', 'dark:text-outline-dark'];
+'text-on-disabled', 'dark:text-on-disabled-dark'];
+const ToolbarButtonFocused = [
+// Typography
+'text-outline', 'dark:text-outline-dark'];
 const ToolbarButtonActive = [
 // Typography
 'text-on-background', 'dark:text-on-background-dark'];
@@ -29598,6 +29602,7 @@ var script = defineComponent({
     const toolbarButtonRef = ref();
     const menuRef = ref();
     const isActive = ref({});
+    const isFocused = ref(props.autofocus);
     const headingLevels = [1, 2, 3, 4];
     const previousHeadingLevel = ref();
     const activeHeadingLevel = ref(0);
@@ -29640,6 +29645,7 @@ var script = defineComponent({
         onUpdate: ({
           editor
         }) => {
+          isFocused.value = true;
           setActiveFormats();
           const html = editor.getHTML();
           const text = editor.getText();
@@ -29701,7 +29707,10 @@ var script = defineComponent({
     onBeforeUnmount(() => {
       editor === null || editor === void 0 ? void 0 : editor.destroy();
     });
-    // trap.activate();
+    onClickOutside(root, () => {
+      isFocused.value = false;
+      // trap.deactivate();
+    });
     // Computed
     const proxyModelValue = computed({
       get: () => {
@@ -29726,6 +29735,7 @@ var script = defineComponent({
     //Methods
     const handleEditorClick = () => {
       setActiveFormats();
+      isFocused.value = true;
       editor === null || editor === void 0 ? void 0 : editor.commands.focus();
     };
     const handleToolbarClick = (item, level) => {
@@ -29798,7 +29808,7 @@ var script = defineComponent({
       return [...ToolbarContainer];
     });
     const toolbarStyles = computed(() => {
-      return [...Toolbar];
+      return [...Toolbar, ...(isFocused.value ? ToolbarButtonFocused : ToolbarButton)];
     });
     const editorInputStyles = computed(() => {
       return ['tiptap-editor', ...(props.fullHeight ? ['h-full'] : []), ...EditorInput];
@@ -29808,7 +29818,7 @@ var script = defineComponent({
       // Layout
       'flex',
       // Spacing
-      'gap-md', ...(isActive.value[item] ? ToolbarButtonActive : ToolbarButton)];
+      'gap-md', ...(isActive.value[item] ? ToolbarButtonActive : [])];
     };
     //Effects
     watch(proxyModelValue, value => {

package/dist/bundled/v3/components/index.js

@@ -96,7 +96,7 @@ export { p as PropsV3, a as useQueueV3, u as useToastV3 } from '../useToast-4d43
 export { s as OrTooltip } from '../OrTooltip.vue_vue_type_script_lang-fa52d391.js';
 export { s as OrTooltipContent } from '../OrTooltipContent-b0dcb862.js';
 export { s as OrTooltipV3 } from '../OrTooltip.vue_vue_type_script_lang-67cc86ed.js';
-export { s as OrRichTextEditorV3 } from '../OrRichTextEditor.vue_vue_type_script_lang-1aa9ad53.js';
+export { s as OrRichTextEditorV3 } from '../OrRichTextEditor.vue_vue_type_script_lang-067e56ab.js';
 import 'vue';
 import 'lodash';
 import '../OrIcon-1cae8a64.js';

package/dist/bundled/v3/components/or-rich-text-editor-v3/index.js

@@ -1,5 +1,6 @@
-export { s as OrRichTextEditorV3 } from '../../OrRichTextEditor.vue_vue_type_script_lang-1aa9ad53.js';
+export { s as OrRichTextEditorV3 } from '../../OrRichTextEditor.vue_vue_type_script_lang-067e56ab.js';
 import 'vue';
+import '@vueuse/core';
 import '../../codemirrorView-77ce9187.js';
 import '../../index-780d00b0.js';
 import 'node:punycode';
@@ -10,7 +11,6 @@ import '../../OrIcon-d878b768.js';
 import '../../OrIcon.vue_vue_type_script_lang-a119a715.js';
 import '../../useClassAttribute-00888f78.js';
 import '../../OrTooltip.vue_vue_type_script_lang-67cc86ed.js';
-import '@vueuse/core';
 import '../../OrPopover-c462ce77.js';
 import '../../OrPopover.vue_vue_type_script_lang-54c7b11c.js';
 import '../../floating-ui.dom.esm-83eba816.js';

package/dist/bundled/v3/components/or-rich-text-editor-v3/styles.d.ts

@@ -2,5 +2,6 @@ export declare const EditorContainer: string[];
 export declare const ToolbarContainer: string[];
 export declare const Toolbar: string[];
 export declare const ToolbarButton: string[];
+export declare const ToolbarButtonFocused: string[];
 export declare const ToolbarButtonActive: string[];
 export declare const EditorInput: string[];