playbook_ui 12.9.1.pre.alpha.menucleanup342 → 12.9.1.pre.alpha.play664tiptapinvestigation353

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 1989f07868254d732bff09d69a085aea374c14b76679b120efc068adbdd78237
-  data.tar.gz: d002dba7896b13cbfa0e2adddaebbe0a735cb8c5036ff02ec23c3ab4acb48481
+  metadata.gz: 61ba9a2cef24c5fa7a495f102e609cc97cc72bff9274a72c997da47e96b160a7
+  data.tar.gz: 1d5afc2eb0c7c1db82403a81a129133714c6966d49689f27abf009308cdd62db
 SHA512:
-  metadata.gz: 204999c57dee19b70aaf3f4a5cc9e7d361ac099201cf7074bc48b30c77661cea7b117d823ac2437ef60d606a640393b449ec281836cae477c265abd6f6672e29
-  data.tar.gz: 22ea9097dbedf3c02f9cc06057ccbb6e79c358038942e9c2ba06fd3bcbd392e1cda92a94e52c17f2c3b0c13c0783f57acf6641ca6e882ff48dbc90fd5f94cb71
+  metadata.gz: f983a47ce1cb184449bb35351735e60fbc6665325ac50326c91cf63a442cfe1ceb1e8b74b4f12f410e10a9de3cf85e20113a6b2b8581aa44f1a3376e6087eec7
+  data.tar.gz: f167f1101eb9b74e99b3b6cd51f59ac331dc54f4557ce3a8fe2383cc805540877ae41a3df8d6f288d6fcb2b08183ea6e5c961a4fda9410d70f32e69e4cd3b2f9

data/{dist → app/pb_kits/playbook/data}/menu.yml

@@ -108,4 +108,3 @@ kits:
     - title_detail
   - user_badge
   - walkthrough
-  - tired

data/app/pb_kits/playbook/pb_rich_text_editor/_rich_text_editor.jsx

@@ -7,6 +7,7 @@ import inlineFocus from './inlineFocus'
 import useFocus from './useFocus'
 import { globalProps } from '../utilities/globalProps'
 import { buildAriaProps, buildDataProps, noop } from '../utilities/props'
+import PBTipTapEditor from './_tiptap'
 
 try {
   const Trix = require('trix')
@@ -20,6 +21,7 @@ import { TrixEditor } from "react-trix"
 
 type RichTextEditorProps = {
   aria?: object,
+  advanced?: Boolean,
   toolbarBottom?: Boolean,
   className?: string,
   data?: object,
@@ -38,6 +40,7 @@ type RichTextEditorProps = {
 const RichTextEditor = (props: RichTextEditorProps) => {
   const {
     aria = {},
+    advanced = false,
     toolbarBottom = false,
     className,
     data = {},
@@ -145,14 +148,23 @@ const RichTextEditor = (props: RichTextEditorProps) => {
         {...dataProps}
         className={css}
     >
-      <TrixEditor
-          className=""
-          fileParamName={name}
-          onChange={onChange}
-          onEditorReady={handleOnEditorReady}
-          placeholder={placeholder}
-          value={value}
-      />
+      {
+        advanced ? (
+          <>
+          <PBTipTapEditor/>
+          </>
+        ) : (
+          <TrixEditor
+              className=""
+              fileParamName={name}
+              onChange={onChange}
+              onEditorReady={handleOnEditorReady}
+              placeholder={placeholder}
+              value={value}
+          />
+        )
+      }
+      
     </div>
   )
 }

data/app/pb_kits/playbook/pb_rich_text_editor/_tiptap.jsx

@@ -0,0 +1,66 @@
+import React from 'react'
+import { useEditor, EditorContent } from "@tiptap/react"
+import StarterKit from "@tiptap/starter-kit"
+import Bold from '@tiptap/extension-bold'
+import Strike from '@tiptap/extension-strike'
+import Italic from '@tiptap/extension-italic'
+
+const PBTipTapEditor = () => {
+    const editor = useEditor({
+        extensions: [
+            StarterKit,
+            Bold,
+            Italic,
+            Strike
+        ],
+        content:"Hi from Tiptap!"
+    })
+    Bold.configure({
+        HTMLAttributes: {
+          class: 'my-custom-class',
+        },
+      })
+      if (!editor) {
+        return null
+      }
+
+    return (
+        <>
+        <button
+            className={editor.isActive('bold') ? 'is-active' : ''}
+            onClick={() => editor.chain().focus().toggleBold().run()}
+        >
+        Bold
+        </button>
+        <button
+            className={editor.isActive('italic') ? 'is-active' : ''}
+            disabled={
+            !editor.can()
+                .chain()
+                .focus()
+                .toggleItalic()
+                .run()
+            }
+            onClick={() => editor.chain().focus().toggleItalic().run()}
+        >
+        italic
+        </button>
+        <button
+            className={editor.isActive('strike') ? 'is-active' : ''}
+            disabled={
+            !editor.can()
+                .chain()
+                .focus()
+                .toggleStrike()
+                .run()
+            }
+            onClick={() => editor.chain().focus().toggleStrike().run()}
+        >
+        strike
+        </button>
+        <EditorContent editor={editor}/>
+        </>
+    )
+}
+
+export default PBTipTapEditor

data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_tip_tap.jsx

@@ -0,0 +1,15 @@
+import React from 'react'
+import { RichTextEditor } from '../..'
+
+const RichTextEditorTipTap = (props) => {
+  return (
+    <div>
+      <RichTextEditor
+          advanced
+          {...props}
+      />
+    </div>
+  )
+}
+
+export default RichTextEditorTipTap

data/app/pb_kits/playbook/pb_rich_text_editor/docs/example.yml

@@ -13,6 +13,7 @@ examples:
 
   react:
   - rich_text_editor_default: Default
+  - rich_text_editor_tip_tap: Advanced
   - rich_text_editor_simple: Simple
   - rich_text_editor_attributes: Attributes
   - rich_text_editor_focus: Focus
@@ -21,3 +22,4 @@ examples:
   - rich_text_editor_toolbar_bottom: Toolbar Bottom
   - rich_text_editor_inline: Inline
   - rich_text_editor_preview: Preview
+

data/app/pb_kits/playbook/pb_rich_text_editor/docs/index.js

@@ -7,3 +7,4 @@ export { default as RichTextEditorTemplates } from './_rich_text_editor_template
 export { default as RichTextEditorToolbarBottom } from './_rich_text_editor_toolbar_bottom.jsx'
 export { default as RichTextEditorInline } from './_rich_text_editor_inline.jsx'
 export { default as RichTextEditorPreview } from './_rich_text_editor_preview.jsx'
+export { default as RichTextEditorTipTap } from './_rich_text_editor_tip_tap.jsx'

data/lib/playbook/pb_doc_helper.rb

@@ -27,9 +27,9 @@ module Playbook
 
     # Deal with lists of kits, used in Playbook doc and Externally
     # rubocop:disable Style/StringConcatenation
-    def pb_kits(type: "rails", limit_examples: false, dark_mode: false, method: get_kits)
+    def pb_kits(type: "rails", limit_examples: false, dark_mode: false)
       display_kits = []
-      kits = method
+      kits = get_kits
       kits.each do |kit|
         if kit.is_a?(Hash)
           nav_hash_array(kit).each do |sub_kit|
@@ -45,12 +45,7 @@ module Playbook
 
     # rubocop:disable Naming/AccessorMethodName
     def get_kits
-      menu = YAML.load_file(Playbook::Engine.root.join("dist/menu.yml"))
-      menu["kits"]
-    end
-
-    def get_kits_pb_website
-      menu = YAML.load_file(Rails.root.join("config/menu.yml"))
+      menu = YAML.load_file(Playbook::Engine.root.join("app/pb_kits/playbook/data/menu.yml"))
       menu["kits"]
     end
     # rubocop:enable Naming/AccessorMethodName

data/lib/playbook/version.rb

@@ -2,5 +2,5 @@
 
 module Playbook
   PREVIOUS_VERSION = "12.9.1"
-  VERSION = "12.9.1.pre.alpha.menucleanup342"
+  VERSION = "12.9.1.pre.alpha.play664tiptapinvestigation353"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 12.9.1.pre.alpha.menucleanup342
+  version: 12.9.1.pre.alpha.play664tiptapinvestigation353
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2023-03-17 00:00:00.000000000 Z
+date: 2023-03-21 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -294,6 +294,7 @@ files:
 - Rakefile
 - app/pb_kits/playbook/_playbook.scss
 - app/pb_kits/playbook/_reset.scss
+- app/pb_kits/playbook/data/menu.yml
 - app/pb_kits/playbook/index.js
 - app/pb_kits/playbook/pb_avatar/_avatar.scss
 - app/pb_kits/playbook/pb_avatar/_avatar.tsx
@@ -1706,6 +1707,7 @@ files:
 - app/pb_kits/playbook/pb_radio/radio.test.js
 - app/pb_kits/playbook/pb_rich_text_editor/_rich_text_editor.jsx
 - app/pb_kits/playbook/pb_rich_text_editor/_rich_text_editor.scss
+- app/pb_kits/playbook/pb_rich_text_editor/_tiptap.jsx
 - app/pb_kits/playbook/pb_rich_text_editor/_trix_styles.scss
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_attributes.html.erb
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_attributes.jsx
@@ -1723,6 +1725,7 @@ files:
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_sticky.jsx
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_templates.html.erb
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_templates.jsx
+- app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_tip_tap.jsx
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_toolbar_bottom.html.erb
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_toolbar_bottom.jsx
 - app/pb_kits/playbook/pb_rich_text_editor/docs/example.yml
@@ -2383,7 +2386,6 @@ files:
 - app/pb_kits/playbook/utilities/test/globalProps/justifySelf.test.js
 - app/pb_kits/playbook/utilities/test/globalProps/order.test.js
 - app/pb_kits/playbook/utilities/text.ts
-- dist/menu.yml
 - dist/reset.css
 - lib/playbook.rb
 - lib/playbook/align_content.rb