@yoopta/ui 6.0.0-beta.4 → 6.0.0-beta.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yoopta/ui",
-  "version": "6.0.0-beta.4",
+  "version": "6.0.0-beta.6",
   "description": "UI components for Yoopta Editor",
   "author": "Darginec05 <devopsbanda@gmail.com>",
   "homepage": "https://github.com/Darginec05/Yoopta-Editor#readme",
@@ -10,21 +10,87 @@
   "type": "module",
   "module": "dist/index.js",
   "types": "./dist/index.d.ts",
+  "typesVersions": {
+    "*": {
+      "toolbar": [
+        "./dist/toolbar/index.d.ts"
+      ],
+      "action-menu-list": [
+        "./dist/action-menu-list/index.d.ts"
+      ],
+      "slash-command-menu": [
+        "./dist/slash-command-menu/index.d.ts"
+      ],
+      "block-options": [
+        "./dist/block-options/index.d.ts"
+      ],
+      "floating-block-actions": [
+        "./dist/floating-block-actions/index.d.ts"
+      ],
+      "highlight-color-picker": [
+        "./dist/highlight-color-picker/index.d.ts"
+      ],
+      "portal": [
+        "./dist/portal/index.d.ts"
+      ],
+      "overlay": [
+        "./dist/overlay/index.d.ts"
+      ],
+      "theme": [
+        "./dist/theme/index.d.ts"
+      ]
+    }
+  },
+  "sideEffects": [
+    "**/*.css"
+  ],
   "exports": {
     ".": {
-      "import": "./dist/index.js",
-      "types": "./dist/index.d.ts"
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./toolbar": {
+      "types": "./dist/toolbar/index.d.ts",
+      "import": "./dist/toolbar.js"
+    },
+    "./action-menu-list": {
+      "types": "./dist/action-menu-list/index.d.ts",
+      "import": "./dist/action-menu-list.js"
+    },
+    "./slash-command-menu": {
+      "types": "./dist/slash-command-menu/index.d.ts",
+      "import": "./dist/slash-command-menu.js"
+    },
+    "./block-options": {
+      "types": "./dist/block-options/index.d.ts",
+      "import": "./dist/block-options.js"
     },
     "./floating-block-actions": {
-      "import": "./dist/floating-block-actions.js",
-      "types": "./dist/floating-block-actions.d.ts"
+      "types": "./dist/floating-block-actions/index.d.ts",
+      "import": "./dist/floating-block-actions.js"
+    },
+    "./highlight-color-picker": {
+      "types": "./dist/highlight-color-picker/index.d.ts",
+      "import": "./dist/highlight-color-picker.js"
+    },
+    "./portal": {
+      "types": "./dist/portal/index.d.ts",
+      "import": "./dist/portal.js"
+    },
+    "./overlay": {
+      "types": "./dist/overlay/index.d.ts",
+      "import": "./dist/overlay.js"
+    },
+    "./theme": {
+      "types": "./dist/theme/index.d.ts",
+      "import": "./dist/theme.js"
     }
   },
   "files": [
     "dist/"
   ],
   "peerDependencies": {
-    "@yoopta/editor": ">=4.9.9",
+    "@yoopta/editor": "6.0.0-beta.4",
     "react": ">=18.2.0",
     "react-dom": ">=18.2.0"
   },
@@ -57,5 +123,5 @@
   "bugs": {
     "url": "https://github.com/Darginec05/Yoopta-Editor/issues"
   },
-  "gitHead": "7259edee990882228148adcca6a6adafa1aa8b03"
+  "gitHead": "4c99cc586ce4c17cd837e3136a068121af44cc8f"
 }

package/dist/block-options/store.d.ts

@@ -1,15 +0,0 @@
-export type BlockOptionsStore = {
-    blockId: string | null;
-    state: 'open' | 'closed';
-    reference: HTMLElement | null;
-    open: (options: {
-        reference: HTMLElement;
-        blockId?: string;
-    }) => void;
-    close: () => void;
-    toggle: (actionState: 'open' | 'closed', reference?: HTMLElement | null, blockId?: string | null) => void;
-    setReference: (node: HTMLElement | null) => void;
-    reset: () => void;
-};
-export declare const useBlockOptionsStore: import("zustand").UseBoundStore<import("zustand").StoreApi<BlockOptionsStore>>;
-//# sourceMappingURL=store.d.ts.map

package/dist/block-options/store.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"store.d.ts","sourceRoot":"","sources":["../../src/block-options/store.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,KAAK,EAAE,MAAM,GAAG,QAAQ,CAAC;IACzB,SAAS,EAAE,WAAW,GAAG,IAAI,CAAC;IAE9B,IAAI,EAAE,CAAC,OAAO,EAAE;QAAE,SAAS,EAAE,WAAW,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACtE,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,MAAM,EAAE,CACN,WAAW,EAAE,MAAM,GAAG,QAAQ,EAC9B,SAAS,CAAC,EAAE,WAAW,GAAG,IAAI,EAC9B,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,KACpB,IAAI,CAAC;IACV,YAAY,EAAE,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IACjD,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,oBAAoB,gFAkD9B,CAAC"}

package/dist/block-options/store.test.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=store.test.d.ts.map

package/dist/block-options/store.test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"store.test.d.ts","sourceRoot":"","sources":["../../src/block-options/store.test.ts"],"names":[],"mappings":""}

package/dist/index-16ebe43d.js

@@ -1,10 +0,0 @@
-import{jsx as t}from"react/jsx-runtime";import o,{memo as e,forwardRef as n,useCallback as a,useEffect as i}from"react";import{useYooptaEditor as r}from"@yoopta/editor";function u(t,o){var e={};for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&o.indexOf(n)<0&&(e[n]=t[n]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(n=Object.getOwnPropertySymbols(t);a<n.length;a++)o.indexOf(n[a])<0&&Object.prototype.propertyIsEnumerable.call(t,n[a])&&(e[n[a]]=t[n[a]])}return e}function s(t,o){void 0===o&&(o={});var e=o.insertAt;if(t&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===e&&n.firstChild?n.insertBefore(a,n.firstChild):n.appendChild(a),a.styleSheet?a.styleSheet.cssText=t:a.appendChild(document.createTextNode(t))}}"function"==typeof SuppressedError&&SuppressedError;s(":root{--yoopta-ui-background:0 0% 100%;--yoopta-ui-foreground:222.2 84% 4.9%;--yoopta-ui-muted:210 40% 96.1%;--yoopta-ui-muted-foreground:215.4 16.3% 46.9%;--yoopta-ui-border:214.3 31.8% 91.4%;--yoopta-ui-ring:222.2 84% 4.9%;--yoopta-ui-accent:210 40% 96.1%;--yoopta-ui-accent-foreground:222.2 47.4% 11.2%;--yoopta-ui-floating-bg:var(--yoopta-ui-background);--yoopta-ui-floating-border:var(--yoopta-ui-border);--yoopta-ui-floating-shadow:0 1px 2px 0 rgba(0,0,0,.05);--yoopta-ui-floating-shadow-md:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--yoopta-ui-floating-z-index:100;--yoopta-ui-floating-gap:1px;--yoopta-ui-floating-padding:3px;--yoopta-ui-floating-radius:0.5rem;--yoopta-ui-floating-offset:46px;--yoopta-ui-floating-button-min-width:24px;--yoopta-ui-floating-button-min-height:24px;--yoopta-ui-floating-button-padding-y:4px;--yoopta-ui-floating-button-padding-x:6px;--yoopta-ui-floating-button-color:var(--yoopta-ui-foreground);--yoopta-ui-floating-button-bg:transparent;--yoopta-ui-floating-button-hover:var(--yoopta-ui-accent);--yoopta-ui-floating-button-active:var(--yoopta-ui-accent);--yoopta-ui-floating-button-radius:0.375rem;--yoopta-ui-floating-transition:color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out;--yoopta-ui-floating-ring-offset:2px;--yoopta-ui-floating-ring:var(--yoopta-ui-ring);--yoopta-ui-floating-icon-size:1rem}.dark,[data-theme=dark],[data-yoopta-theme=dark]{--yoopta-ui-background:222.2 84% 4.9%;--yoopta-ui-foreground:210 40% 98%;--yoopta-ui-muted:217.2 32.6% 17.5%;--yoopta-ui-muted-foreground:215 20.2% 65.1%;--yoopta-ui-border:217.2 32.6% 17.5%;--yoopta-ui-ring:212.7 26.8% 83.9%;--yoopta-ui-accent:217.2 32.6% 17.5%;--yoopta-ui-accent-foreground:210 40% 98%;--yoopta-ui-floating-shadow:0 1px 2px 0 rgba(0,0,0,.3);--yoopta-ui-floating-shadow-md:0 4px 6px -1px rgba(0,0,0,.5),0 2px 4px -2px rgba(0,0,0,.3)}.yoopta-ui-floating-block-actions{align-items:center;background-color:hsl(var(--yoopta-ui-floating-bg));border:1px solid hsl(var(--yoopta-ui-floating-border));border-radius:var(--yoopta-ui-floating-radius);box-shadow:var(--yoopta-ui-floating-shadow-md);display:inline-flex;gap:var(--yoopta-ui-floating-gap);padding:var(--yoopta-ui-floating-padding);z-index:var(--yoopta-ui-floating-z-index)}.yoopta-ui-floating-action-button{align-items:center;background-color:var(--yoopta-ui-floating-button-bg);border:none;border-radius:var(--yoopta-ui-floating-button-radius);color:hsl(var(--yoopta-ui-floating-button-color));cursor:pointer;display:inline-flex;font-size:.875rem;font-weight:500;justify-content:center;line-height:1;min-height:var(--yoopta-ui-floating-button-min-height);min-width:var(--yoopta-ui-floating-button-min-width);outline:none;padding:var(--yoopta-ui-floating-button-padding-y) var(--yoopta-ui-floating-button-padding-x);touch-action:manipulation;transition:var(--yoopta-ui-floating-transition);-moz-user-select:none;user-select:none;-webkit-user-select:none;white-space:nowrap}.yoopta-ui-floating-action-button:hover{background-color:hsl(var(--yoopta-ui-floating-button-hover));color:hsl(var(--yoopta-ui-accent-foreground))}.yoopta-ui-floating-action-button:active{background-color:hsl(var(--yoopta-ui-floating-button-active));transform:scale(.98)}.yoopta-ui-floating-action-button:focus-visible{box-shadow:0 0 0 var(--yoopta-ui-floating-ring-offset) hsl(var(--yoopta-ui-background)),0 0 0 calc(var(--yoopta-ui-floating-ring-offset) + 2px) hsl(var(--yoopta-ui-floating-ring));outline:none}.yoopta-ui-floating-action-button:disabled{opacity:.5;pointer-events:none}.yoopta-ui-floating-action-button svg{flex-shrink:0;height:var(--yoopta-ui-floating-icon-size);width:var(--yoopta-ui-floating-icon-size)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--yoopta-ui-background:222.2 84% 4.9%;--yoopta-ui-foreground:210 40% 98%;--yoopta-ui-muted:217.2 32.6% 17.5%;--yoopta-ui-muted-foreground:215 20.2% 65.1%;--yoopta-ui-border:217.2 32.6% 17.5%;--yoopta-ui-ring:212.7 26.8% 83.9%;--yoopta-ui-accent:217.2 32.6% 17.5%;--yoopta-ui-accent-foreground:210 40% 98%}}");const l=t=>{let o;const e=new Set,n=(t,n)=>{const a="function"==typeof t?t(o):t;if(!Object.is(a,o)){const t=o;o=(null!=n?n:"object"!=typeof a||null===a)?a:Object.assign({},o,a),e.forEach(e=>e(o,t))}},a=()=>o,i={setState:n,getState:a,getInitialState:()=>r,subscribe:t=>(e.add(t),()=>e.delete(t)),destroy:()=>{"production"!==(import.meta.env?import.meta.env.MODE:void 0)&&console.warn("[DEPRECATED] The `destroy` method will be unsupported in a future version. Instead use unsubscribe function returned by subscribe. Everything will be garbage-collected if store is garbage-collected."),e.clear()}},r=o=t(n,a,i);return i};function c(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var p,d,f,g={},y={get exports(){return g},set exports(t){g=t}},b={},v={},m={get exports(){return v},set exports(t){v=t}},h={};function x(){return d||(d=1,m.exports=function(){if(p)return h;p=1;var t=o,e="function"==typeof Object.is?Object.is:function(t,o){return t===o&&(0!==t||1/t==1/o)||t!=t&&o!=o},n=t.useState,a=t.useEffect,i=t.useLayoutEffect,r=t.useDebugValue;function u(t){var o=t.getSnapshot;t=t.value;try{var n=o();return!e(t,n)}catch(t){return!0}}var s="undefined"==typeof window||void 0===window.document||void 0===window.document.createElement?function(t,o){return o()}:function(t,o){var e=o(),s=n({inst:{value:e,getSnapshot:o}}),l=s[0].inst,c=s[1];return i(function(){l.value=e,l.getSnapshot=o,u(l)&&c({inst:l})},[t,e,o]),a(function(){return u(l)&&c({inst:l}),t(function(){u(l)&&c({inst:l})})},[t]),r(e),e};return h.useSyncExternalStore=void 0!==t.useSyncExternalStore?t.useSyncExternalStore:s,h}()),v}
-/**
- * @license React
- * use-sync-external-store-shim/with-selector.production.js
- *
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */y.exports=function(){if(f)return b;f=1;var t=o,e=x(),n="function"==typeof Object.is?Object.is:function(t,o){return t===o&&(0!==t||1/t==1/o)||t!=t&&o!=o},a=e.useSyncExternalStore,i=t.useRef,r=t.useEffect,u=t.useMemo,s=t.useDebugValue;return b.useSyncExternalStoreWithSelector=function(t,o,e,l,c){var p=i(null);if(null===p.current){var d={hasValue:!1,value:null};p.current=d}else d=p.current;p=u(function(){function t(t){if(!r){if(r=!0,a=t,t=l(t),void 0!==c&&d.hasValue){var o=d.value;if(c(o,t))return i=o}return i=t}if(o=i,n(a,t))return o;var e=l(t);return void 0!==c&&c(o,e)?(a=t,o):(a=t,i=e)}var a,i,r=!1,u=void 0===e?null:e;return[function(){return t(o())},null===u?void 0:function(){return t(u())}]},[o,e,l,c]);var f=a(t,p[0],p[1]);return r(function(){d.hasValue=!0,d.value=f},[f]),s(f),f},b}();var E=c(g);const{useDebugValue:w}=o,{useSyncExternalStoreWithSelector:k}=E;let S=!1;const O=t=>t;const j=t=>{"production"!==(import.meta.env?import.meta.env.MODE:void 0)&&"function"!=typeof t&&console.warn("[DEPRECATED] Passing a vanilla store will be unsupported in a future version. Instead use `import { useStore } from 'zustand'`.");const o="function"==typeof t?(t=>t?l(t):l)(t):t,e=(t,e)=>function(t,o=O,e){"production"!==(import.meta.env?import.meta.env.MODE:void 0)&&e&&!S&&(console.warn("[DEPRECATED] Use `createWithEqualityFn` instead of `create` or use `useStoreWithEqualityFn` instead of `useStore`. They can be imported from 'zustand/traditional'. https://github.com/pmndrs/zustand/discussions/1937"),S=!0);const n=k(t.subscribe,t.getState,t.getServerState||t.getInitialState,o,e);return w(n),n}(o,t,e);return Object.assign(e,o),e},D=t=>t?j(t):j,I={position:"fixed",top:0,left:0,opacity:0,pointerEvents:"none",transform:"scale(0.95) translateX(-46px)",transition:"opacity 150ms ease-out, transform 150ms ease-out"},z=D()((t,o)=>({blockId:null,state:"closed",position:{top:0,left:0},styles:I,reference:null,setReference(o){t({reference:o})},toggle(o,e){t({state:o,blockId:e||null})},updatePosition(e,n,a=46){t({position:{top:e,left:n},styles:Object.assign(Object.assign({},o().styles),{top:e,left:n,opacity:1,transform:`scale(1) translateX(-${a+2}px)`,pointerEvents:"auto"})})},hide(){t({state:"closed",blockId:null,styles:Object.assign(Object.assign({},o().styles),{opacity:0,transform:I.transform,pointerEvents:"none"})})},reset(){t({blockId:null,state:"closed",position:{top:0,left:0},styles:I})}})),C=e(({children:o,className:e})=>{const{setReference:n,styles:a}=z();return t("div",Object.assign({ref:n,className:`yoopta-ui-floating-block-actions ${e}`,style:a,contentEditable:!1,onClick:t=>t.stopPropagation(),onMouseDown:t=>t.stopPropagation()},{children:o}))});C.displayName="FloatingBlockActions.Root";const P=n((o,e)=>{var{children:n,onClick:a,className:i="",disabled:r,title:s}=o,l=u(o,["children","onClick","className","disabled","title"]);return t("button",Object.assign({ref:e,type:"button",className:`yoopta-ui-floating-action-button ${i}`,onClick:a,disabled:r,title:s,"aria-label":s},l,{children:n}))});P.displayName="FloatingBlockActions.Button";const T=Object.assign(C,{Root:C,Button:P});function B(t,o,{leading:e=!0,trailing:n=!0}={}){let a=0,i=null,r=null;const u=o=>{t(...r),a=o,r=null},s=(...t)=>{const s=Date.now();a||e||(a=s);const l=o-(s-a);r=t,l<=0||l>o?(i&&(clearTimeout(i),i=null),u(s)):!i&&n&&(i=setTimeout(()=>{i=null,n&&r&&u(Date.now())},l))};return s.cancel=()=>{i&&(clearTimeout(i),i=null),r=null,a=0},s}const R=()=>{const t=z();return{reference:t.reference,floatingBlockId:t.blockId,state:t.state,styles:t.styles,toggle:t.toggle,hide:t.hide,reset:t.reset}},N=()=>{const t=r(),o=z(),e=a((t,e)=>{var n;const a=t.getBoundingClientRect(),i=(null===(n=o.reference)||void 0===n?void 0:n.offsetWidth)||46;o.updatePosition(a.top+2,a.left,i)},[o]),n=a(()=>{o.hide()},[o]),u=a(o=>{if(!t.refElement)return null;const e=t.refElement.querySelectorAll("[data-yoopta-block]"),n=window.innerHeight;let a=null,i=1/0;if(e.forEach(t=>{const e=t.getBoundingClientRect();if(e.bottom<-200||e.top>n+200)return;if(o>=e.top&&o<=e.bottom)return a=t,void(i=0);const r=o<e.top?e.top-o:o-e.bottom;r<i&&(i=r,a=t)}),a&&i<=100){const o=a.getAttribute("data-yoopta-block-id"),e=o?t.children[o]:null;if(o&&e)return{element:a,data:e}}return null},[t]),s=B(a(a=>{var i,r;if("frozen"===o.state)return;const s=a.target,l=null===(i=t.refElement)||void 0===i?void 0:i.contains(a.target),c=null===(r=o.reference)||void 0===r?void 0:r.contains(s);if(!l)return n();if(t.readOnly)return;if(c)return;const p=u(a.clientY);if(p){const{element:t,data:n}=p;n.id!==o.blockId&&(o.toggle("hovering",n.id),e(t,n))}else null!==o.blockId&&n()},[o,t,n,u,e]),100,{leading:!0,trailing:!0});return i(()=>{const t=()=>{"frozen"!==o.state&&n()};return document.addEventListener("mousemove",s),document.addEventListener("scroll",t,!0),()=>{document.removeEventListener("mousemove",s),document.removeEventListener("scroll",t,!0)}},[s,n,o.state]),{reference:o.reference,floatingBlockId:o.blockId,state:o.state,styles:o.styles,toggle:o.toggle,hide:o.hide,reset:o.reset}};export{T as F,u as _,R as a,z as b,D as c,s,B as t,N as u};