@apolitical/component-library 4.1.0-beta.0 → 4.1.0-beta.3

package/discussion/components/form/form.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import { DiscussionCreateContentFunction, IDiscussionContent } from './../../discussion';
 export interface IDiscussionForm {
     /** Information about the content being created/edited */
@@ -20,8 +19,6 @@ export interface IDiscussionForm {
         /** Whether the success message should show on a successful submit */
         showSuccessMessage?: boolean;
     };
-    /** The `ref` for the input, if we need to have control over it in the parent */
-    editorRef?: React.MutableRefObject<string | null>;
     /** The placeholder text - this defaults to the intl text */
     placeholder?: string;
     /** The maximum number of characters */
@@ -50,5 +47,5 @@ export interface IDiscussionForm {
     /** The language to use for the text */
     locale?: string;
 }
-declare const Form: ({ content, userHasPermissions, meta, editorRef, placeholder, maxLength, forceShow, functions, gtmContext, }: IDiscussionForm) => import("react/jsx-runtime").JSX.Element;
+declare const Form: ({ content, userHasPermissions, meta, placeholder, maxLength, forceShow, functions, gtmContext, }: IDiscussionForm) => import("react/jsx-runtime").JSX.Element;
 export default Form;

package/discussion/components/likes/likes.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { MemberProps } from '../../../user';
 import { IDiscussionContent } from './../../discussion';
 interface Props {
@@ -25,5 +26,11 @@ interface Props {
     /** The language to use for the text */
     locale?: string;
 }
-declare const Likes: ({ element, likes, peopleWhoLiked, isShort, userLiked, content, canLike, functions: { createLike, deleteLike }, }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const Likes: ({ element, likes, peopleWhoLiked, isShort, userLiked, content, canLike, functions: { createLike, deleteLike }, }: Props) => React.DetailedReactHTMLElement<{
+    className: string;
+    onKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;
+    onMouseEnter: () => void;
+    onMouseLeave: () => void;
+    onBlur: () => void;
+}, HTMLElement>;
 export default Likes;

package/form/components/form/form.d.ts

@@ -1,3 +1,3 @@
 import { IFormProps } from './form.types';
-declare const Form: ({ fields, className, id: formId, formRef: ref, intlPath, button, secondaryActionButton, meta, gtm, functions: { onSuccess, onCancel, onCatch, onFailure, }, ...props }: IFormProps) => import("react/jsx-runtime").JSX.Element | null;
+declare const Form: ({ element, fields, className, id: formId, formRef: ref, intlPath, button, secondaryActionButton, meta, gtm, functions: { onSuccess, onCancel, onCatch, onFailure, }, ...props }: IFormProps) => import("react/jsx-runtime").JSX.Element | null;
 export default Form;

package/form/components/form/form.types.d.ts

@@ -174,6 +174,8 @@ export interface IFormProps {
     secondaryActionButton?: FormCancelButtonPropsType;
     /** The classes to add to the form */
     className?: string;
+    /** The type of element to render. This is in case we need to render a separate form inside the first, e.g. rendering the link form on the rich text editor inside the discussion form. */
+    element?: 'form' | 'fieldset';
     /** The fields to render in the form */
     fields: IField[];
     /** An optional `ref` for the form, in case we need to interact with it in another file */

package/form/components/rich-text-editor/components/context/context.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import { Dispatch } from 'react';
 import { Point } from 'slate';
 declare const RichTextEditorContext: import("react").Context<{
     /** The id of the editor */
@@ -9,15 +9,11 @@ declare const RichTextEditorContext: import("react").Context<{
     setFocus: (option: string | null) => void;
     /** The tooltip that is currently open */
     openTooltip: string | null;
-    /** The function to set the open tooltip */
-    setOpenTooltip: (option: string | null) => void;
     /** Whether the link editor is open */
     showLinkEditor: boolean;
-    /** The function to set the link editor */
-    setShowLinkEditor: (open: boolean) => void;
     /** The last anchor point (used for Slate to know where the cursor is) */
     lastAnchor: Point | null;
-    /** The function to set the last anchor */
-    setLastAnchor: (anchor: Point | null) => void;
+    /** The function to update the state */
+    dispatch: Dispatch<any>;
 }>;
 export default RichTextEditorContext;

package/form/components/rich-text-editor/rich-text-editor.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 interface Props {
     /** The id of the rich text editor */
     id?: string;
@@ -15,5 +14,5 @@ interface Props {
     /**  Optional aria error message */
     'aria-errormessage'?: string;
 }
-declare const RichTextEditor: React.ForwardRefExoticComponent<Props & React.RefAttributes<string | null>>;
+declare const RichTextEditor: ({ id, value, placeholder, onChange, autoFocus, ...props }: Props) => import("react/jsx-runtime").JSX.Element | null;
 export default RichTextEditor;

package/general/buttons/button/button.d.ts

@@ -28,6 +28,12 @@ export interface ButtonPropsType {
     element?: string;
     /** The function the button should run when clicked */
     onClick?: false | ((e: React.MouseEvent<HTMLElement>) => void);
+    /** An optional function to call on focus */
+    onFocus?: () => void;
+    /** An optional function to call on blur */
+    onBlur?: () => void;
+    /** An optional function to call on keydown */
+    onKeyDown?: (e: React.KeyboardEvent<HTMLElement>) => void;
     /** Additional classes to add to the button */
     className?: string;
     /** `disabled` is usually true or false, but we will want nuance in some places, for example the ability
@@ -61,6 +67,6 @@ export interface ButtonPropsType {
     'data-testid'?: string;
 }
 declare const Button: ({ variant, size, styling, icon, href, element, onClick, className, disabled, screenreaderText, children, ...rest }: ButtonPropsType) => React.DOMElement<{
-    [key: string]: string | boolean | addClasses.ArgumentArray | ((e: React.MouseEvent<HTMLElement>) => void) | React.RefObject<HTMLButtonElement>;
+    [key: string]: string | boolean | addClasses.ArgumentArray | (() => void) | ((e: React.KeyboardEvent<HTMLElement>) => void) | ((e: React.MouseEvent<HTMLElement>) => void) | React.RefObject<HTMLButtonElement>;
 }, Element>;
 export default Button;

package/general/link/link.d.ts

@@ -10,6 +10,8 @@ interface Props {
     className?: string;
     /** Function to be called when clicked */
     onClick?: ((e?: React.MouseEvent<HTMLElement>) => void) | undefined;
+    /** Function to be called when focused */
+    onFocus?: ((e?: React.FocusEvent<HTMLElement>) => void) | undefined;
     /** GTM event context */
     gtmContext?: string;
     /** GTM event type */

package/general/tooltip/tooltip.d.ts

@@ -30,6 +30,8 @@ interface Props {
     };
     /** Whether the tooltip is hidden from screen readers or not */
     'aria-hidden'?: boolean;
+    /** The id of the tooltip */
+    id?: string;
 }
 declare const Tooltip: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLElement | null>>;
 export default Tooltip;