@rhc-shared-components/rich-text-editor 1.0.0 → 1.1.0

package/README.md

@@ -2,46 +2,8 @@
 
 > WYSWYG Editor for Red Hat Certified Apps
 
-[![NPM](https://img.shields.io/npm/v/@rhc-shared-components/rich-text-editor.svg)](https://www.npmjs.com/package/@rhc-shared-components/rich-text-editor) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
-
 ## Install
 
 ```bash
-yarn add @rhc-shared-components/rich-text-editor
+npm install --save @rhc-shared-components/rich-text-editor
 ```
-
-## Usage
-
-```tsx
-import React from 'react';
-import { RichTextEditorFormComponent, RichTextEditor } from '@rhc-shared-components/rich-text-editor';
-import { Formik } from 'formik';
-import { Title } from "@patternfly/react-core";
-
-const App = () => {
-  const FieldName = 'richtext';
-  return (
-    <div>
-      <Title headingLevel={'h1'}>RichTextEditor</Title>
-      <RichTextEditor value={"<h3>hello world from normal RTE</h3>"}/>
-      <Title headingLevel={'h1'}>RichTextEditor with formik</Title>
-      <Formik
-        initialValues={{
-          [FieldName]: '<h1>Hello world</h1>'
-        }}
-        enableReinitialize={true}
-        onSubmit={()=>{}}>
-        <RichTextEditorFormComponent
-          name={FieldName}
-          label={'Rich text form label'}
-          helperText={'This is a test description'}
-          isRequired={true}
-        />
-      </Formik>
-    </div>);
-}
-```
-
-## License
-
-MIT © [gautamkrishnar](https://github.com/gautamkrishnar)

package/dist/RichTextEditor.d.ts

@@ -1,16 +1,18 @@
-import * as React from 'react';
-declare type RichTextEditorFunctionType = (value: string, event?: Event, editor?: any) => void;
-export interface RichTextEditorProps {
-    value: string;
-    disabled?: boolean;
-    onReady?: (editor: any) => void;
-    onChange?: RichTextEditorFunctionType;
-    onBlur?: RichTextEditorFunctionType;
-    onFocus?: RichTextEditorFunctionType;
-    onError?: RichTextEditorFunctionType;
-    id?: string;
-    name?: string;
-    showCodeBlock?: boolean;
-}
-declare const RichTextEditor: React.FC<RichTextEditorProps>;
-export default RichTextEditor;
+import * as React from 'react';
+type RichTextEditorFunctionType = (value: string, event?: any, editor?: any) => void;
+export interface RichTextEditorProps {
+    value: string;
+    disabled?: boolean;
+    onReady?: (editor: any) => void;
+    onChange?: RichTextEditorFunctionType;
+    onBlur?: RichTextEditorFunctionType;
+    onFocus?: RichTextEditorFunctionType;
+    onError?: (error: Error, details?: any) => void;
+    id?: string;
+    name?: string;
+    showCodeBlock?: boolean;
+    ariaLabel?: string;
+    placeholder?: string;
+}
+declare const RichTextEditor: React.FC<RichTextEditorProps>;
+export default RichTextEditor;

package/dist/RichTextEditorFormComponent.d.ts

@@ -1,20 +1,20 @@
-import * as React from 'react';
-declare global {
-    interface Window {
-        ckeditorObj: any[];
-    }
-}
-export interface RichTextEditorFormComponentProps {
-    name: string;
-    label: string;
-    disabled?: boolean;
-    isRequired?: boolean;
-    placeholder?: string;
-    ariaLabel?: string;
-    helperText?: string;
-    showMaxLengthText?: boolean;
-    maxLength?: number;
-    showCodeBlock?: boolean;
-}
-declare const RichTextEditorFormComponent: React.FC<RichTextEditorFormComponentProps>;
-export default RichTextEditorFormComponent;
+import * as React from 'react';
+declare global {
+    interface Window {
+        ckeditorObj: any[];
+    }
+}
+export interface RichTextEditorFormComponentProps {
+    name: string;
+    label: string;
+    disabled?: boolean;
+    isRequired?: boolean;
+    placeholder?: string;
+    ariaLabel?: string;
+    helperText?: string;
+    showMaxLengthText?: boolean;
+    maxLength?: number;
+    showCodeBlock?: boolean;
+}
+declare const RichTextEditorFormComponent: React.FC<RichTextEditorFormComponentProps>;
+export default RichTextEditorFormComponent;

package/dist/assets/index.css

@@ -0,0 +1 @@
+.rich-text-editor-custom{--rte-h1-internal-LineHeight: var(--pf-v5-global--LineHeight--sm, --pf-global--LineHeight--sm);--rte-h1-internal-FontSize: var(--pf-v5-global--FontSize--2xl, --pf-global--FontSize--2xl);--rte-h1-internal-FontWeight: var(--pf-v5-global--FontWeight--normal, --pf-global--FontWeight--normal);--rte-h2-internal-LineHeight: var(--pf-v5-global--LineHeight--md, -pf-global--LineHeight--mD);--rte-h2-internal-FontSize: var(--pf-v5-global--FontSize--xl, --pf-global--FontSize--xl);--rte-h2-internal-FontWeight: var(--pf-v5-global--FontWeight--normal, --pf-global--FontWeight--normal);--rte-h3-internal-LineHeight: var(--pf-v5-global--LineHeight--md, -pf-global--LineHeight--md);--rte-h3-internal-FontSize: var(--pf-v5-global--FontSize--lg, --pf-global--FontSize--lg);--rte-h3-internal-FontWeight: var(--pf-v5-global--FontWeight--normal, --pf-global--FontWeight--normal);--rte-h4-internal-LineHeight: var(--pf-v5-global--LineHeight--md, --pf-global--LineHeight--md);--rte-h4-internal-FontSize: var(--pf-v5-global--FontSize--md, --pf-global--FontSize--md);--rte-h4-internal-FontWeight: var( --pf-v5-global--FontWeight--normal, --pf-global--FontWeight--normal)}.rich-text-editor-custom .ck-editor__main{word-break:break-all}.rich-text-editor-custom .ck-code-block-dropdown .ck-splitbutton__arrow{display:none}.rich-text-editor-custom h1{font-size:var(--rte-h1-internal-FontSize);font-weight:var(--rte-h1-internal-FontWeight);line-height:var(--rte-h1-internal-LineHeight)}.rich-text-editor-custom h2{font-size:var(--rte-h2-internal-FontSize);font-weight:var(--rte-h2-internal-FontWeight);line-height:var(--rte-h2-internal-LineHeight)}.rich-text-editor-custom h3{font-size:var(--rte-h3-internal-FontSize);font-weight:var(--rte-h3-internal-FontWeight);line-height:var(--rte-h3-internal-LineHeight)}.rich-text-editor-custom h4{font-size:var(--rte-h4-internal-FontSize);font-weight:var(--rte-h4-internal-FontWeight);line-height:var(--rte-h4-internal-LineHeight)}.rich-text-editor-custom ul{display:block;list-style-type:disc;margin-block-start:1em;margin-block-end:1em;margin-inline-start:0;margin-inline-end:0;padding-inline-start:40px}.rich-text-editor-custom ul li{display:list-item}.rich-text-editor-custom ul ul{list-style-type:circle;margin-block-start:0;margin-block-end:0}.rich-text-editor-custom ol{display:block;list-style-type:decimal;margin-block-start:1em;margin-block-end:1em;margin-inline-start:0;margin-inline-end:0;padding-inline-start:40px}

package/dist/index.d.ts

@@ -1,3 +1,3 @@
-import RichTextEditor from './RichTextEditor';
-import RichTextEditorFormComponent from './RichTextEditorFormComponent';
-export { RichTextEditor, RichTextEditorFormComponent };
+import { default as RichTextEditor } from './RichTextEditor';
+import { default as RichTextEditorFormComponent } from './RichTextEditorFormComponent';
+export { RichTextEditor, RichTextEditorFormComponent };