@crystallize/design-system 1.5.0 → 1.6.1

package/src/rich-text-editor/themes/{PlaygroundEditorTheme.css → CrystallizeRTEditorTheme.css}

@@ -6,20 +6,20 @@
  *
  *
  */
-.PlaygroundEditorTheme__ltr {
+.CrystallizeRTEditorTheme__ltr {
   @apply text-left;
 }
-.PlaygroundEditorTheme__rtl {
+.CrystallizeRTEditorTheme__rtl {
   @apply text-right;
 }
-.PlaygroundEditorTheme__paragraph {
+.CrystallizeRTEditorTheme__paragraph {
   font-size: 15px;
   @apply relative m-0 mt-2 leading-6 text-gray-600-300;
 }
-.PlaygroundEditorTheme__paragraph + .PlaygroundEditorTheme__paragraph {
+.CrystallizeRTEditorTheme__paragraph + .CrystallizeRTEditorTheme__paragraph {
   @apply relative m-0 mt-4;
 }
-.PlaygroundEditorTheme__quote {
+.CrystallizeRTEditorTheme__quote {
   font-size: 15px;
   border-left-width: 4px;
   border-left-style: solid;
@@ -28,59 +28,59 @@
   @apply my-6 border-l-purple-700-200 font-normal text-gray-800-100;
 }
 
-.PlaygroundEditorTheme__h1 {
+.CrystallizeRTEditorTheme__h1 {
   font-size: 20px;
 
   @apply m-0 mb-1 mt-2 font-medium leading-6
     text-gray-800-100;
 }
-.PlaygroundEditorTheme__h2 {
+.CrystallizeRTEditorTheme__h2 {
   font-size: 19px;
   @apply m-0 mb-1 mt-2 text-lg font-medium leading-6 text-gray-800-100;
 }
-.PlaygroundEditorTheme__h3 {
+.CrystallizeRTEditorTheme__h3 {
   font-size: 18px;
   @apply m-0 mb-1 mt-2  font-medium leading-6 text-gray-800-100;
 }
-.PlaygroundEditorTheme__h4 {
+.CrystallizeRTEditorTheme__h4 {
   font-size: 17px;
   @apply m-0 mb-1 mt-2  font-medium leading-6 text-gray-800-100;
 }
-.PlaygroundEditorTheme__h5 {
+.CrystallizeRTEditorTheme__h5 {
   font-size: 16px;
   @apply m-0 mb-1 mt-2  font-medium leading-6 text-gray-800-100;
 }
-.PlaygroundEditorTheme__h6 {
+.CrystallizeRTEditorTheme__h6 {
   font-size: 16px;
   @apply m-0 mb-1 mt-2 font-medium leading-6 text-gray-800-100;
 }
-.PlaygroundEditorTheme__indent {
+.CrystallizeRTEditorTheme__indent {
   --lexical-indent-base-value: 20px;
 }
-.PlaygroundEditorTheme__textBold {
+.CrystallizeRTEditorTheme__textBold {
   @apply font-bold;
 }
-.PlaygroundEditorTheme__textItalic {
+.CrystallizeRTEditorTheme__textItalic {
   @apply italic;
 }
-.PlaygroundEditorTheme__textUnderline {
+.CrystallizeRTEditorTheme__textUnderline {
   @apply underline;
 }
-.PlaygroundEditorTheme__textStrikethrough {
+.CrystallizeRTEditorTheme__textStrikethrough {
   @apply line-through;
 }
-.PlaygroundEditorTheme__textUnderlineStrikethrough {
+.CrystallizeRTEditorTheme__textUnderlineStrikethrough {
   text-decoration: underline line-through;
 }
-.PlaygroundEditorTheme__textSubscript {
+.CrystallizeRTEditorTheme__textSubscript {
   font-size: 0.8em;
   vertical-align: sub !important;
 }
-.PlaygroundEditorTheme__textSuperscript {
+.CrystallizeRTEditorTheme__textSuperscript {
   font-size: 0.8em;
   vertical-align: super;
 }
-.PlaygroundEditorTheme__textCode {
+.CrystallizeRTEditorTheme__textCode {
   padding: 2px 0.5rem;
   font-family: Menlo, Consolas, Monaco, monospace;
   font-size: 13px;
@@ -88,31 +88,27 @@
   border-style: solid;
   @apply rounded-md border-gray-100-800 bg-purple-50-900;
 }
-.PlaygroundEditorTheme__hashtag {
-  background-color: rgba(88, 144, 255, 0.15);
-  border-bottom: 1px solid rgba(88, 144, 255, 0.3);
-}
-.PlaygroundEditorTheme__link {
+.CrystallizeRTEditorTheme__link {
   text-decoration: none;
   box-shadow: #5d96fd 0 -2px inset;
   @apply !text-gray-600-300;
 }
-.PlaygroundEditorTheme__link:hover {
+.CrystallizeRTEditorTheme__link:hover {
   cursor: pointer;
 }
-.PlaygroundEditorTheme__code {
+.CrystallizeRTEditorTheme__code {
   @apply relative my-2 mx-0 block overflow-x-auto rounded-md border border-solid border-gray-100-800 bg-purple-50-900 p-2 pl-14 text-sm leading-5;
   font-family: Menlo, Consolas, Monaco, monospace;
   font-size: 12px;
   tab-size: 2;
 }
-.PlaygroundEditorTheme__code:before {
+.CrystallizeRTEditorTheme__code:before {
   @apply absolute top-0 left-0 border-0 border-r-[1px] border-solid border-gray-100-800 bg-purple-100-800 p-2 text-right text-gray-400-500;
   content: attr(data-gutter);
   white-space: pre-wrap;
   min-width: 25px;
 }
-.PlaygroundEditorTheme__table {
+.CrystallizeRTEditorTheme__table {
   /* border-collapse: collapse; */
   border-spacing: 0;
   max-width: 100%;
@@ -126,19 +122,19 @@
   @apply rounded-md border-gray-100-800;
 }
 
-.PlaygroundEditorTheme__tableSelected {
+.CrystallizeRTEditorTheme__tableSelected {
   @apply outline-2 outline-purple-200-700;
 }
-.PlaygroundEditorTheme__tableCell {
+.CrystallizeRTEditorTheme__tableCell {
   @apply relative cursor-default border border-solid border-gray-100-800 px-2 py-0 text-start align-top outline-none;
   min-width: 75px;
   border-width: 0 0 1px 1px;
 }
 
-.PlaygroundEditorTheme__tableCell .PlaygroundEditorTheme__paragraph {
+.CrystallizeRTEditorTheme__tableCell .CrystallizeRTEditorTheme__paragraph {
   @apply my-2 text-sm;
 }
-.PlaygroundEditorTheme__tableCellSortedIndicator {
+.CrystallizeRTEditorTheme__tableCellSortedIndicator {
   display: block;
   opacity: 0.5;
   position: absolute;
@@ -148,7 +144,7 @@
   height: 4px;
   background-color: #999;
 }
-.PlaygroundEditorTheme__tableCellResizer {
+.CrystallizeRTEditorTheme__tableCellResizer {
   position: absolute;
   right: -4px;
   height: 100%;
@@ -157,14 +153,14 @@
   z-index: 10;
   top: 0;
 }
-.PlaygroundEditorTheme__tableCellHeader {
+.CrystallizeRTEditorTheme__tableCellHeader {
   @apply bg-purple-50-900;
   text-align: start;
 }
-.PlaygroundEditorTheme__tableCellSelected {
+.CrystallizeRTEditorTheme__tableCellSelected {
   background-color: #c9dbf0;
 }
-.PlaygroundEditorTheme__tableCellPrimarySelected {
+.CrystallizeRTEditorTheme__tableCellPrimarySelected {
   @apply border-2 border-solid border-purple-200-700;
 
   display: block;
@@ -175,11 +171,11 @@
   top: -1px;
   z-index: 2;
 }
-.PlaygroundEditorTheme__tableCellEditing {
+.CrystallizeRTEditorTheme__tableCellEditing {
   @apply shadow-md;
   border-radius: 3px;
 }
-.PlaygroundEditorTheme__tableAddColumns {
+.CrystallizeRTEditorTheme__tableAddColumns {
   position: absolute;
   top: 0;
   width: 20px;
@@ -191,7 +187,7 @@
   border: 1px solid transparent;
   @apply bg-purple-50-900;
 }
-.PlaygroundEditorTheme__tableAddColumns:after {
+.CrystallizeRTEditorTheme__tableAddColumns:after {
   background-image: url(../images/icons/plus.svg);
   background-size: contain;
   background-position: center;
@@ -205,10 +201,10 @@
   height: 100%;
   opacity: 1;
 }
-.PlaygroundEditorTheme__tableAddColumns:hover {
+.CrystallizeRTEditorTheme__tableAddColumns:hover {
   @apply rounded-sm border-purple-200-700;
 }
-.PlaygroundEditorTheme__tableAddRows {
+.CrystallizeRTEditorTheme__tableAddRows {
   position: absolute;
   bottom: -25px;
   width: calc(100% - 25px);
@@ -221,7 +217,7 @@
 
   @apply bg-purple-50-900;
 }
-.PlaygroundEditorTheme__tableAddRows:after {
+.CrystallizeRTEditorTheme__tableAddRows:after {
   background-image: url(../images/icons/plus.svg);
   background-size: contain;
   background-position: center;
@@ -235,7 +231,7 @@
   height: 100%;
   opacity: 1;
 }
-.PlaygroundEditorTheme__tableAddRows:hover {
+.CrystallizeRTEditorTheme__tableAddRows:hover {
   @apply rounded-sm border-purple-200-700;
 }
 @keyframes table-controls {
@@ -246,7 +242,7 @@
     opacity: 1;
   }
 }
-.PlaygroundEditorTheme__tableCellResizeRuler {
+.CrystallizeRTEditorTheme__tableCellResizeRuler {
   display: block;
   position: absolute;
   width: 1px;
@@ -254,7 +250,7 @@
   height: 100%;
   top: 0;
 }
-.PlaygroundEditorTheme__tableCellActionButtonContainer {
+.CrystallizeRTEditorTheme__tableCellActionButtonContainer {
   display: block;
   right: 5px;
   top: 6px;
@@ -263,7 +259,7 @@
   width: 20px;
   height: 20px;
 }
-.PlaygroundEditorTheme__tableCellActionButton {
+.CrystallizeRTEditorTheme__tableCellActionButton {
   background-color: #eee;
   display: block;
   border: 0;
@@ -273,52 +269,52 @@
   color: #222;
   cursor: pointer;
 }
-.PlaygroundEditorTheme__tableCellActionButton:hover {
+.CrystallizeRTEditorTheme__tableCellActionButton:hover {
   background-color: #ddd;
 }
-.PlaygroundEditorTheme__characterLimit {
+.CrystallizeRTEditorTheme__characterLimit {
   display: inline;
   background-color: #ffbbbb !important;
 }
-.PlaygroundEditorTheme__ol1 {
+.CrystallizeRTEditorTheme__ol1 {
   padding: 0;
   margin: 0;
   list-style-position: inside;
 }
-.PlaygroundEditorTheme__ol2 {
+.CrystallizeRTEditorTheme__ol2 {
   padding: 0;
   margin: 0;
   list-style-type: upper-alpha;
   list-style-position: inside;
 }
-.PlaygroundEditorTheme__ol3 {
+.CrystallizeRTEditorTheme__ol3 {
   padding: 0;
   margin: 0;
   list-style-type: lower-alpha;
   list-style-position: inside;
 }
-.PlaygroundEditorTheme__ol4 {
+.CrystallizeRTEditorTheme__ol4 {
   padding: 0;
   margin: 0;
   list-style-type: upper-roman;
   list-style-position: inside;
 }
-.PlaygroundEditorTheme__ol5 {
+.CrystallizeRTEditorTheme__ol5 {
   padding: 0;
   margin: 0;
   list-style-type: lower-roman;
   list-style-position: inside;
 }
-.PlaygroundEditorTheme__ul {
+.CrystallizeRTEditorTheme__ul {
   padding: 0;
   margin: 0;
   list-style-position: inside;
 }
-.PlaygroundEditorTheme__listItem {
+.CrystallizeRTEditorTheme__listItem {
   @apply my-0 mx-5 leading-6 text-gray-600-300;
 }
-.PlaygroundEditorTheme__listItemChecked,
-.PlaygroundEditorTheme__listItemUnchecked {
+.CrystallizeRTEditorTheme__listItemChecked,
+.CrystallizeRTEditorTheme__listItemUnchecked {
   position: relative;
   margin-left: 8px;
   margin-right: 8px;
@@ -327,11 +323,11 @@
   list-style-type: none;
   outline: none;
 }
-.PlaygroundEditorTheme__listItemChecked {
+.CrystallizeRTEditorTheme__listItemChecked {
   text-decoration: line-through;
 }
-.PlaygroundEditorTheme__listItemUnchecked:before,
-.PlaygroundEditorTheme__listItemChecked:before {
+.CrystallizeRTEditorTheme__listItemUnchecked:before,
+.CrystallizeRTEditorTheme__listItemChecked:before {
   content: '';
   width: 16px;
   height: 16px;
@@ -342,27 +338,27 @@
   background-size: cover;
   position: absolute;
 }
-.PlaygroundEditorTheme__listItemUnchecked[dir='rtl']:before,
-.PlaygroundEditorTheme__listItemChecked[dir='rtl']:before {
+.CrystallizeRTEditorTheme__listItemUnchecked[dir='rtl']:before,
+.CrystallizeRTEditorTheme__listItemChecked[dir='rtl']:before {
   left: auto;
   right: 0;
 }
-.PlaygroundEditorTheme__listItemUnchecked:focus:before,
-.PlaygroundEditorTheme__listItemChecked:focus:before {
+.CrystallizeRTEditorTheme__listItemUnchecked:focus:before,
+.CrystallizeRTEditorTheme__listItemChecked:focus:before {
   box-shadow: 0 0 0 2px #a6cdfe;
   border-radius: 2px;
 }
-.PlaygroundEditorTheme__listItemUnchecked:before {
+.CrystallizeRTEditorTheme__listItemUnchecked:before {
   border: 1px solid #999;
   border-radius: 2px;
 }
-.PlaygroundEditorTheme__listItemChecked:before {
+.CrystallizeRTEditorTheme__listItemChecked:before {
   border: 1px solid rgb(61, 135, 245);
   border-radius: 2px;
   background-color: #3d87f5;
   background-repeat: no-repeat;
 }
-.PlaygroundEditorTheme__listItemChecked:after {
+.CrystallizeRTEditorTheme__listItemChecked:after {
   content: '';
   cursor: pointer;
   border-color: #fff;
@@ -377,57 +373,57 @@
   transform: rotate(45deg);
   border-width: 0 2px 2px 0;
 }
-.PlaygroundEditorTheme__nestedListItem {
+.CrystallizeRTEditorTheme__nestedListItem {
   list-style-type: none;
 }
-.PlaygroundEditorTheme__nestedListItem:before,
-.PlaygroundEditorTheme__nestedListItem:after {
+.CrystallizeRTEditorTheme__nestedListItem:before,
+.CrystallizeRTEditorTheme__nestedListItem:after {
   display: none;
 }
-.PlaygroundEditorTheme__tokenComment {
+.CrystallizeRTEditorTheme__tokenComment {
   color: slategray;
 }
-.PlaygroundEditorTheme__tokenPunctuation {
+.CrystallizeRTEditorTheme__tokenPunctuation {
   color: #999;
 }
-.PlaygroundEditorTheme__tokenProperty {
+.CrystallizeRTEditorTheme__tokenProperty {
   color: #905;
 }
-.PlaygroundEditorTheme__tokenSelector {
+.CrystallizeRTEditorTheme__tokenSelector {
   color: #690;
 }
-.PlaygroundEditorTheme__tokenOperator {
+.CrystallizeRTEditorTheme__tokenOperator {
   color: #9a6e3a;
 }
-.PlaygroundEditorTheme__tokenAttr {
+.CrystallizeRTEditorTheme__tokenAttr {
   color: #07a;
 }
-.PlaygroundEditorTheme__tokenVariable {
+.CrystallizeRTEditorTheme__tokenVariable {
   color: #e90;
 }
-.PlaygroundEditorTheme__tokenFunction {
+.CrystallizeRTEditorTheme__tokenFunction {
   color: #dd4a68;
 }
-.PlaygroundEditorTheme__mark {
+.CrystallizeRTEditorTheme__mark {
   background: rgba(255, 212, 0, 0.14);
   border-bottom: 2px solid rgba(255, 212, 0, 0.3);
   padding-bottom: 2px;
 }
-.PlaygroundEditorTheme__markOverlap {
+.CrystallizeRTEditorTheme__markOverlap {
   background: rgba(255, 212, 0, 0.3);
   border-bottom: 2px solid rgba(255, 212, 0, 0.7);
 }
-.PlaygroundEditorTheme__mark.selected {
+.CrystallizeRTEditorTheme__mark.selected {
   background: rgba(255, 212, 0, 0.5);
   border-bottom: 2px solid rgba(255, 212, 0, 1);
 }
-.PlaygroundEditorTheme__markOverlap.selected {
+.CrystallizeRTEditorTheme__markOverlap.selected {
   background: rgba(255, 212, 0, 0.7);
   border-bottom: 2px solid rgba(255, 212, 0, 0.7);
 }
-.PlaygroundEditorTheme__embedBlock {
+.CrystallizeRTEditorTheme__embedBlock {
   user-select: none;
 }
-.PlaygroundEditorTheme__embedBlockFocus {
+.CrystallizeRTEditorTheme__embedBlockFocus {
   outline: 2px solid rgb(60, 132, 244);
 }

package/src/rich-text-editor/themes/CrystallizeRTEditorTheme.ts

@@ -0,0 +1,113 @@
+/**
+ * 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.
+ *
+ */
+
+import type { EditorThemeClasses } from 'lexical';
+
+import './CrystallizeRTEditorTheme.css';
+
+const theme: EditorThemeClasses = {
+  blockCursor: 'CrystallizeRTEditorTheme__blockCursor',
+  characterLimit: 'CrystallizeRTEditorTheme__characterLimit',
+  code: 'CrystallizeRTEditorTheme__code',
+  codeHighlight: {
+    atrule: 'CrystallizeRTEditorTheme__tokenAttr',
+    attr: 'CrystallizeRTEditorTheme__tokenAttr',
+    boolean: 'CrystallizeRTEditorTheme__tokenProperty',
+    builtin: 'CrystallizeRTEditorTheme__tokenSelector',
+    cdata: 'CrystallizeRTEditorTheme__tokenComment',
+    char: 'CrystallizeRTEditorTheme__tokenSelector',
+    class: 'CrystallizeRTEditorTheme__tokenFunction',
+    'class-name': 'CrystallizeRTEditorTheme__tokenFunction',
+    comment: 'CrystallizeRTEditorTheme__tokenComment',
+    constant: 'CrystallizeRTEditorTheme__tokenProperty',
+    deleted: 'CrystallizeRTEditorTheme__tokenProperty',
+    doctype: 'CrystallizeRTEditorTheme__tokenComment',
+    entity: 'CrystallizeRTEditorTheme__tokenOperator',
+    function: 'CrystallizeRTEditorTheme__tokenFunction',
+    important: 'CrystallizeRTEditorTheme__tokenVariable',
+    inserted: 'CrystallizeRTEditorTheme__tokenSelector',
+    keyword: 'CrystallizeRTEditorTheme__tokenAttr',
+    namespace: 'CrystallizeRTEditorTheme__tokenVariable',
+    number: 'CrystallizeRTEditorTheme__tokenProperty',
+    operator: 'CrystallizeRTEditorTheme__tokenOperator',
+    prolog: 'CrystallizeRTEditorTheme__tokenComment',
+    property: 'CrystallizeRTEditorTheme__tokenProperty',
+    punctuation: 'CrystallizeRTEditorTheme__tokenPunctuation',
+    regex: 'CrystallizeRTEditorTheme__tokenVariable',
+    selector: 'CrystallizeRTEditorTheme__tokenSelector',
+    string: 'CrystallizeRTEditorTheme__tokenSelector',
+    symbol: 'CrystallizeRTEditorTheme__tokenProperty',
+    tag: 'CrystallizeRTEditorTheme__tokenProperty',
+    url: 'CrystallizeRTEditorTheme__tokenOperator',
+    variable: 'CrystallizeRTEditorTheme__tokenVariable',
+  },
+  embedBlock: {
+    base: 'CrystallizeRTEditorTheme__embedBlock',
+    focus: 'CrystallizeRTEditorTheme__embedBlockFocus',
+  },
+  hashtag: 'CrystallizeRTEditorTheme__hashtag',
+  heading: {
+    h1: 'CrystallizeRTEditorTheme__h1',
+    h2: 'CrystallizeRTEditorTheme__h2',
+    h3: 'CrystallizeRTEditorTheme__h3',
+    h4: 'CrystallizeRTEditorTheme__h4',
+    h5: 'CrystallizeRTEditorTheme__h5',
+    h6: 'CrystallizeRTEditorTheme__h6',
+  },
+  image: 'editor-image',
+  indent: 'CrystallizeRTEditorTheme__indent',
+  link: 'CrystallizeRTEditorTheme__link',
+  list: {
+    listitem: 'CrystallizeRTEditorTheme__listItem',
+    listitemChecked: 'CrystallizeRTEditorTheme__listItemChecked',
+    listitemUnchecked: 'CrystallizeRTEditorTheme__listItemUnchecked',
+    nested: {
+      listitem: 'CrystallizeRTEditorTheme__nestedListItem',
+    },
+    olDepth: [
+      'CrystallizeRTEditorTheme__ol1',
+      'CrystallizeRTEditorTheme__ol2',
+      'CrystallizeRTEditorTheme__ol3',
+      'CrystallizeRTEditorTheme__ol4',
+      'CrystallizeRTEditorTheme__ol5',
+    ],
+    ul: 'CrystallizeRTEditorTheme__ul',
+  },
+  ltr: 'CrystallizeRTEditorTheme__ltr',
+  mark: 'CrystallizeRTEditorTheme__mark',
+  markOverlap: 'CrystallizeRTEditorTheme__markOverlap',
+  paragraph: 'CrystallizeRTEditorTheme__paragraph',
+  quote: 'CrystallizeRTEditorTheme__quote',
+  rtl: 'CrystallizeRTEditorTheme__rtl',
+  table: 'CrystallizeRTEditorTheme__table',
+  tableAddColumns: 'CrystallizeRTEditorTheme__tableAddColumns',
+  tableAddRows: 'CrystallizeRTEditorTheme__tableAddRows',
+  tableCell: 'CrystallizeRTEditorTheme__tableCell',
+  tableCellActionButton: 'CrystallizeRTEditorTheme__tableCellActionButton',
+  tableCellActionButtonContainer: 'CrystallizeRTEditorTheme__tableCellActionButtonContainer',
+  tableCellEditing: 'CrystallizeRTEditorTheme__tableCellEditing',
+  tableCellHeader: 'CrystallizeRTEditorTheme__tableCellHeader',
+  tableCellPrimarySelected: 'CrystallizeRTEditorTheme__tableCellPrimarySelected',
+  tableCellResizer: 'CrystallizeRTEditorTheme__tableCellResizer',
+  tableCellSelected: 'CrystallizeRTEditorTheme__tableCellSelected',
+  tableCellSortedIndicator: 'CrystallizeRTEditorTheme__tableCellSortedIndicator',
+  tableResizeRuler: 'CrystallizeRTEditorTheme__tableCellResizeRuler',
+  tableSelected: 'CrystallizeRTEditorTheme__tableSelected',
+  text: {
+    bold: 'CrystallizeRTEditorTheme__textBold',
+    code: 'CrystallizeRTEditorTheme__textCode',
+    italic: 'CrystallizeRTEditorTheme__textItalic',
+    strikethrough: 'CrystallizeRTEditorTheme__textStrikethrough',
+    subscript: 'CrystallizeRTEditorTheme__textSubscript',
+    superscript: 'CrystallizeRTEditorTheme__textSuperscript',
+    underline: 'CrystallizeRTEditorTheme__textUnderline',
+    underlineStrikethrough: 'CrystallizeRTEditorTheme__textUnderlineStrikethrough',
+  },
+};
+
+export default theme;

package/dist/draggable-block-menu-KKHDNKJA.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24" fill="currentColor"><path stroke="currentColor" d="M8.5 10a2 2 0 1 0 2 2 2 2 0 0 0-2-2Zm0 7a2 2 0 1 0 2 2 2 2 0 0 0-2-2Zm7-10a2 2 0 1 0-2-2 2 2 0 0 0 2 2Zm-7-4a2 2 0 1 0 2 2 2 2 0 0 0-2-2Zm7 14a2 2 0 1 0 2 2 2 2 0 0 0-2-2Zm0-7a2 2 0 1 0 2 2 2 2 0 0 0-2-2Z"/></svg>

package/src/rich-text-editor/appSettings.ts

@@ -1,28 +0,0 @@
-/**
- * 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.
- *
- */
-
-export type SettingName =
-  | 'disableBeforeInput'
-  | 'measureTypingPerf'
-  | 'isCharLimit'
-  | 'isMaxLength'
-  | 'isCharLimitUtf8'
-  | 'isAutocomplete'
-  | 'showNestedEditorTreeView';
-
-export type Settings = Record<SettingName, boolean>;
-
-export const DEFAULT_SETTINGS: Settings = {
-  disableBeforeInput: false,
-  isAutocomplete: false,
-  isCharLimit: false,
-  isCharLimitUtf8: false,
-  isMaxLength: false,
-  measureTypingPerf: false,
-  showNestedEditorTreeView: false,
-};

package/src/rich-text-editor/context/SettingsContext.tsx

@@ -1,71 +0,0 @@
-/**
- * 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.
- *
- */
-
-import type { SettingName } from '../appSettings';
-
-import { createContext, ReactNode, useCallback, useContext, useMemo, useState } from 'react';
-
-import { DEFAULT_SETTINGS } from '../appSettings';
-
-type SettingsContextShape = {
-  setOption: (name: SettingName, value: boolean) => void;
-  settings: Record<SettingName, boolean>;
-};
-
-const Context: React.Context<SettingsContextShape> = createContext({
-  setOption: (name: SettingName, value: boolean) => {
-    // eslint-disable-next-line no-console
-    console.log({ name, value });
-    return;
-  },
-  settings: DEFAULT_SETTINGS,
-});
-
-export const SettingsContext = ({ children }: { children: ReactNode }): JSX.Element => {
-  const [settings, setSettings] = useState(DEFAULT_SETTINGS);
-
-  const setOption = useCallback((setting: SettingName, value: boolean) => {
-    setSettings(options => ({
-      ...options,
-      [setting as string]: value,
-    }));
-    if (DEFAULT_SETTINGS[setting] === value) {
-      setURLParam(setting, null);
-    } else {
-      setURLParam(setting, value);
-    }
-  }, []);
-
-  const contextValue = useMemo(() => {
-    return { setOption, settings };
-  }, [setOption, settings]);
-
-  return <Context.Provider value={contextValue}>{children}</Context.Provider>;
-};
-
-export const useSettings = (): SettingsContextShape => {
-  return useContext(Context);
-};
-
-function setURLParam(param: SettingName, value: null | boolean) {
-  const url = new URL(window.location.href);
-  const params = new URLSearchParams(url.search);
-  if (value !== null) {
-    if (params.has(param)) {
-      params.set(param, String(value));
-    } else {
-      params.append(param, String(value));
-    }
-  } else {
-    if (params.has(param)) {
-      params.delete(param);
-    }
-  }
-  url.search = params.toString();
-  window.history.pushState(null, '', url.toString());
-}