@flexiui/svelte-rich-text 0.0.5 → 0.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/RichText.svelte +96 -93
  2. package/package.json +1 -1
package/dist/RichText.svelte CHANGED
@@ -364,7 +364,7 @@
364
364
  <div class="fl-rich-text {className}" class:editable>
365
365
  {#if editor}
366
366
  <header class="fl-rich-text-toolbar">
367
- <div role="group" class="fl-rich-text-toolbar-group flex-auto">
367
+ <div role="group" class="fl-rich-text-toolbar-group">
368
368
  <button
369
369
  type="button"
370
370
  onclick={() => $editor.chain().focus().undo().run()}
@@ -660,94 +660,96 @@
660
660
  Paragraph
661
661
  </button> -->
662
662
 
663
- <button
664
- type="button"
665
- onclick={() => setLink()}
666
- class="fl-bubble-menu-mark-button"
667
- class:is-active={$editor.isActive("link")}
668
- aria-label="Link"
669
- >
670
- <svg
671
- width="16"
672
- height="16"
673
- class="tiptap-button-icon"
674
- viewBox="0 0 24 24"
675
- fill="currentColor"
676
- xmlns="http://www.w3.org/2000/svg"
677
- ><path
678
- d="M16.9958 1.06669C15.4226 1.05302 13.907 1.65779 12.7753 2.75074L12.765 2.76086L11.045 4.47086C10.6534 4.86024 10.6515 5.49341 11.0409 5.88507C11.4303 6.27673 12.0634 6.27858 12.4551 5.88919L14.1697 4.18456C14.9236 3.45893 15.9319 3.05752 16.9784 3.06662C18.0272 3.07573 19.0304 3.49641 19.772 4.23804C20.5137 4.97967 20.9344 5.98292 20.9435 7.03171C20.9526 8.07776 20.5515 9.08563 19.8265 9.83941L16.833 12.8329C16.4274 13.2386 15.9393 13.5524 15.4019 13.7529C14.8645 13.9533 14.2903 14.0359 13.7181 13.9949C13.146 13.9539 12.5894 13.7904 12.0861 13.5154C11.5827 13.2404 11.1444 12.8604 10.8008 12.401C10.47 11.9588 9.84333 11.8685 9.40108 12.1993C8.95883 12.5301 8.86849 13.1568 9.1993 13.599C9.71464 14.288 10.3721 14.858 11.1272 15.2705C11.8822 15.683 12.7171 15.9283 13.5753 15.9898C14.4334 16.0513 15.2948 15.9274 16.1009 15.6267C16.907 15.326 17.639 14.8555 18.2473 14.247L21.2472 11.2471L21.2593 11.2347C22.3523 10.1031 22.9571 8.58751 22.9434 7.01433C22.9297 5.44115 22.2987 3.93628 21.1863 2.82383C20.0738 1.71138 18.5689 1.08036 16.9958 1.06669Z"
679
- fill="currentColor"
680
- ></path><path
681
- d="M10.4247 8.0102C9.56657 7.94874 8.70522 8.07256 7.89911 8.37326C7.09305 8.67395 6.36096 9.14458 5.75272 9.753L2.75285 12.7529L2.74067 12.7653C1.64772 13.8969 1.04295 15.4125 1.05662 16.9857C1.07029 18.5589 1.70131 20.0637 2.81376 21.1762C3.9262 22.2886 5.43108 22.9196 7.00426 22.9333C8.57744 22.947 10.0931 22.3422 11.2247 21.2493L11.2371 21.2371L12.9471 19.5271C13.3376 19.1366 13.3376 18.5034 12.9471 18.1129C12.5565 17.7223 11.9234 17.7223 11.5328 18.1129L9.82932 19.8164C9.07555 20.5414 8.06768 20.9425 7.02164 20.9334C5.97285 20.9243 4.9696 20.5036 4.22797 19.762C3.48634 19.0203 3.06566 18.0171 3.05655 16.9683C3.04746 15.9222 3.44851 14.9144 4.17355 14.1606L7.16719 11.167C7.5727 10.7613 8.06071 10.4476 8.59811 10.2471C9.13552 10.0467 9.70976 9.96412 10.2819 10.0051C10.854 10.0461 11.4106 10.2096 11.9139 10.4846C12.4173 10.7596 12.8556 11.1397 13.1992 11.599C13.53 12.0412 14.1567 12.1316 14.5989 11.8007C15.0412 11.4699 15.1315 10.8433 14.8007 10.401C14.2854 9.71205 13.6279 9.14198 12.8729 8.72948C12.1178 8.31697 11.2829 8.07166 10.4247 8.0102Z"
682
- fill="currentColor"
683
- ></path></svg
663
+ <div role="group" class="fl-rich-text-toolbar-group">
664
+ <button
665
+ type="button"
666
+ onclick={() => setLink()}
667
+ class="fl-bubble-menu-mark-button"
668
+ class:is-active={$editor.isActive("link")}
669
+ aria-label="Link"
684
670
  >
685
- </button>
671
+ <svg
672
+ width="16"
673
+ height="16"
674
+ class="tiptap-button-icon"
675
+ viewBox="0 0 24 24"
676
+ fill="currentColor"
677
+ xmlns="http://www.w3.org/2000/svg"
678
+ ><path
679
+ d="M16.9958 1.06669C15.4226 1.05302 13.907 1.65779 12.7753 2.75074L12.765 2.76086L11.045 4.47086C10.6534 4.86024 10.6515 5.49341 11.0409 5.88507C11.4303 6.27673 12.0634 6.27858 12.4551 5.88919L14.1697 4.18456C14.9236 3.45893 15.9319 3.05752 16.9784 3.06662C18.0272 3.07573 19.0304 3.49641 19.772 4.23804C20.5137 4.97967 20.9344 5.98292 20.9435 7.03171C20.9526 8.07776 20.5515 9.08563 19.8265 9.83941L16.833 12.8329C16.4274 13.2386 15.9393 13.5524 15.4019 13.7529C14.8645 13.9533 14.2903 14.0359 13.7181 13.9949C13.146 13.9539 12.5894 13.7904 12.0861 13.5154C11.5827 13.2404 11.1444 12.8604 10.8008 12.401C10.47 11.9588 9.84333 11.8685 9.40108 12.1993C8.95883 12.5301 8.86849 13.1568 9.1993 13.599C9.71464 14.288 10.3721 14.858 11.1272 15.2705C11.8822 15.683 12.7171 15.9283 13.5753 15.9898C14.4334 16.0513 15.2948 15.9274 16.1009 15.6267C16.907 15.326 17.639 14.8555 18.2473 14.247L21.2472 11.2471L21.2593 11.2347C22.3523 10.1031 22.9571 8.58751 22.9434 7.01433C22.9297 5.44115 22.2987 3.93628 21.1863 2.82383C20.0738 1.71138 18.5689 1.08036 16.9958 1.06669Z"
680
+ fill="currentColor"
681
+ ></path><path
682
+ d="M10.4247 8.0102C9.56657 7.94874 8.70522 8.07256 7.89911 8.37326C7.09305 8.67395 6.36096 9.14458 5.75272 9.753L2.75285 12.7529L2.74067 12.7653C1.64772 13.8969 1.04295 15.4125 1.05662 16.9857C1.07029 18.5589 1.70131 20.0637 2.81376 21.1762C3.9262 22.2886 5.43108 22.9196 7.00426 22.9333C8.57744 22.947 10.0931 22.3422 11.2247 21.2493L11.2371 21.2371L12.9471 19.5271C13.3376 19.1366 13.3376 18.5034 12.9471 18.1129C12.5565 17.7223 11.9234 17.7223 11.5328 18.1129L9.82932 19.8164C9.07555 20.5414 8.06768 20.9425 7.02164 20.9334C5.97285 20.9243 4.9696 20.5036 4.22797 19.762C3.48634 19.0203 3.06566 18.0171 3.05655 16.9683C3.04746 15.9222 3.44851 14.9144 4.17355 14.1606L7.16719 11.167C7.5727 10.7613 8.06071 10.4476 8.59811 10.2471C9.13552 10.0467 9.70976 9.96412 10.2819 10.0051C10.854 10.0461 11.4106 10.2096 11.9139 10.4846C12.4173 10.7596 12.8556 11.1397 13.1992 11.599C13.53 12.0412 14.1567 12.1316 14.5989 11.8007C15.0412 11.4699 15.1315 10.8433 14.8007 10.401C14.2854 9.71205 13.6279 9.14198 12.8729 8.72948C12.1178 8.31697 11.2829 8.07166 10.4247 8.0102Z"
683
+ fill="currentColor"
684
+ ></path></svg
685
+ >
686
+ </button>
686
687
 
687
- <button
688
- class="fl-bubble-menu-mark-button"
689
- class:is-active={$editor?.isActive("specialBox")}
690
- onclick={toggleSpecialBox}
691
- type="button"
692
- aria-label="Special Box"
693
- >
694
- <span class="special-box-icon">A</span>
695
- </button>
688
+ <button
689
+ class="fl-bubble-menu-mark-button"
690
+ class:is-active={$editor?.isActive("specialBox")}
691
+ onclick={toggleSpecialBox}
692
+ type="button"
693
+ aria-label="Special Box"
694
+ >
695
+ <span class="special-box-icon">A</span>
696
+ </button>
696
697
 
697
- <button
698
- type="button"
699
- onclick={() => $editor.chain().focus().setHorizontalRule().run()}
700
- aria-label="Horizontal rule"
701
- >
702
- <svg
703
- width="15"
704
- height="15"
705
- viewBox="0 0 15 15"
706
- fill="none"
707
- xmlns="http://www.w3.org/2000/svg"
708
- ><path
709
- d="M2 7.5C2 7.22386 2.22386 7 2.5 7H12.5C12.7761 7 13 7.22386 13 7.5C13 7.77614 12.7761 8 12.5 8H2.5C2.22386 8 2 7.77614 2 7.5Z"
710
- fill="currentColor"
711
- fill-rule="evenodd"
712
- clip-rule="evenodd"
713
- ></path></svg
698
+ <button
699
+ type="button"
700
+ onclick={() => $editor.chain().focus().setHorizontalRule().run()}
701
+ aria-label="Horizontal rule"
714
702
  >
715
- </button>
703
+ <svg
704
+ width="15"
705
+ height="15"
706
+ viewBox="0 0 15 15"
707
+ fill="none"
708
+ xmlns="http://www.w3.org/2000/svg"
709
+ ><path
710
+ d="M2 7.5C2 7.22386 2.22386 7 2.5 7H12.5C12.7761 7 13 7.22386 13 7.5C13 7.77614 12.7761 8 12.5 8H2.5C2.22386 8 2 7.77614 2 7.5Z"
711
+ fill="currentColor"
712
+ fill-rule="evenodd"
713
+ clip-rule="evenodd"
714
+ ></path></svg
715
+ >
716
+ </button>
716
717
 
717
- <button
718
- type="button"
719
- onclick={() => $editor.chain().focus().setHardBreak().run()}
720
- aria-label="Hard break"
721
- >
722
- <svg
723
- xmlns="http://www.w3.org/2000/svg"
724
- width="24"
725
- height="24"
726
- viewBox="0 0 24 24"
727
- fill="none"
728
- stroke="currentColor"
729
- stroke-width="2"
730
- stroke-linecap="round"
731
- stroke-linejoin="round"
732
- class="icon icon-tabler icons-tabler-outline icon-tabler-corner-down-left"
733
- ><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path
734
- d="M18 6v6a3 3 0 0 1 -3 3h-10l4 -4m0 8l-4 -4"
735
- ></path></svg
718
+ <button
719
+ type="button"
720
+ onclick={() => $editor.chain().focus().setHardBreak().run()}
721
+ aria-label="Hard break"
736
722
  >
737
- </button>
723
+ <svg
724
+ xmlns="http://www.w3.org/2000/svg"
725
+ width="24"
726
+ height="24"
727
+ viewBox="0 0 24 24"
728
+ fill="none"
729
+ stroke="currentColor"
730
+ stroke-width="2"
731
+ stroke-linecap="round"
732
+ stroke-linejoin="round"
733
+ class="icon icon-tabler icons-tabler-outline icon-tabler-corner-down-left"
734
+ ><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path
735
+ d="M18 6v6a3 3 0 0 1 -3 3h-10l4 -4m0 8l-4 -4"
736
+ ></path></svg
737
+ >
738
+ </button>
738
739
 
739
- <button
740
- type="button"
741
- onclick={() => $editor.chain().focus().setColor("#958DF1").run()}
742
- class={$editor.isActive("textStyle", { color: "#958DF1" })
743
- ? "is-active"
744
- : ""}
745
- >
746
- <span
747
- style="background: #958DF1;width: 16px;height: 16px;border-radius: 100%;margin-right: 6px;border: 1px solid #d7d7d78a;box-sizing: border-box;"
748
- ></span>
749
- Purple
750
- </button>
740
+ <button
741
+ type="button"
742
+ onclick={() => $editor.chain().focus().setColor("#958DF1").run()}
743
+ class={$editor.isActive("textStyle", { color: "#958DF1" })
744
+ ? "is-active"
745
+ : ""}
746
+ >
747
+ <span
748
+ style="background: #958DF1;width: 16px;height: 16px;border-radius: 100%;margin-right: 6px;border: 1px solid #d7d7d78a;box-sizing: border-box;"
749
+ ></span>
750
+ Purple
751
+ </button>
752
+ </div>
751
753
 
752
754
  <div role="group" class="fl-rich-text-toolbar-group">
753
755
  <button
@@ -812,18 +814,18 @@
812
814
  ></path></svg
813
815
  >
814
816
  </button>
815
- </div>
816
817
 
817
- <button
818
- type="button"
819
- onclick={() => $editor.chain().focus().unsetAllMarks().run()}
820
- >Clear marks</button
821
- >
822
- <button
823
- type="button"
824
- onclick={() => $editor.chain().focus().clearNodes().run()}
825
- >Clear nodes</button
826
- >
818
+ <button
819
+ type="button"
820
+ onclick={() => $editor.chain().focus().unsetAllMarks().run()}
821
+ >Clear marks</button
822
+ >
823
+ <button
824
+ type="button"
825
+ onclick={() => $editor.chain().focus().clearNodes().run()}
826
+ >Clear nodes</button
827
+ >
828
+ </div>
827
829
 
828
830
  <Dropdown
829
831
  bind:refreshDropdown
@@ -974,6 +976,7 @@
974
976
  white-space: nowrap;
975
977
  gap: 2px;
976
978
  cursor: pointer;
979
+ line-height: 1;
977
980
 
978
981
  &:disabled {
979
982
  cursor: not-allowed;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flexiui/svelte-rich-text",
3
- "version": "0.0.5",
3
+ "version": "0.0.7",
4
4
  "description": "A lightweight and flexible rich text editor component for Svelte",
5
5
  "keywords": [
6
6
  "svelte",