@apolitical/component-library 4.0.6 → 4.1.0-beta.10

package/form/components/rich-text-editor/helpers/serialize/index.d.ts

@@ -0,0 +1,2 @@
+export { default as serialize } from './serialize';
+export { default as doSerialize } from './do-serialize';

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

@@ -0,0 +1,8 @@
+import { BlockType, LeafType, NodeTypes } from './../ast-types';
+interface Options {
+    nodeTypes: NodeTypes;
+    listDepth?: number;
+    ignoreParagraphNewline?: boolean;
+}
+export default function serialize(chunk: BlockType | LeafType, opts?: Options): string | undefined;
+export {};

package/form/components/rich-text-editor/helpers/transform/index.d.ts

@@ -0,0 +1 @@
+export { default as transform } from './transform';

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

@@ -0,0 +1,21 @@
+import { BlockQuoteNode, CodeBlockNode, HeadingNode, ImageNode, InputNodeTypes, ItalicNode, LinkNode, ListItemNode, ListNode, MdastNode, OptionType, ParagraphNode, ThematicBreakNode } from './../ast-types';
+export default function transform<T extends InputNodeTypes>(node: MdastNode, opts?: OptionType<T>): CodeBlockNode<T> | HeadingNode<T> | ListNode<T> | ListItemNode<T> | ParagraphNode<T> | LinkNode<T> | ImageNode<T> | BlockQuoteNode<T> | ThematicBreakNode<T> | ItalicNode<T> | {
+    type: string;
+    children: {
+        text: string;
+    }[];
+} | {
+    value?: string | undefined;
+    position?: any;
+    url?: string | undefined;
+    alt?: string | undefined;
+    checked?: any;
+    ordered?: boolean | undefined;
+    depth?: 1 | 2 | 3 | 4 | 5 | 6 | undefined;
+    lang?: string | undefined;
+    spread?: any;
+    indent?: any;
+    text: string | undefined;
+    type?: undefined;
+    children?: undefined;
+};

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

@@ -0,0 +1,2 @@
+export * from './use-positioned-element';
+export * from './use-selected-link';

package/form/components/rich-text-editor/hooks/use-positioned-element/index.d.ts

@@ -0,0 +1 @@
+export { default as usePositionedElement } from './use-positioned-element';

package/form/components/rich-text-editor/hooks/use-positioned-element/use-positioned-element.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { BaseEditor } from 'slate';
+declare const usePositionedElement: (editor: BaseEditor, element: string, fallback: string) => import("react").MutableRefObject<HTMLElement | null>;
+export default usePositionedElement;

package/form/components/rich-text-editor/hooks/use-selected-link/index.d.ts

@@ -0,0 +1 @@
+export { default as useSelectedLink } from './use-selected-link';

package/form/components/rich-text-editor/hooks/use-selected-link/use-selected-link.d.ts

@@ -0,0 +1,6 @@
+import { BaseEditor } from 'slate';
+declare const useSelectedLink: (editor: BaseEditor) => {
+    full: string;
+    pretty: string;
+} | null;
+export default useSelectedLink;

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

@@ -0,0 +1 @@
+export { default as RichTextEditor } from './rich-text-editor';

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

@@ -0,0 +1 @@
+export * from './with-linlines';

package/form/components/rich-text-editor/plugins/with-linlines/index.d.ts

@@ -0,0 +1 @@
+export { default as withInlines } from './with-inlines';

package/form/components/rich-text-editor/plugins/with-linlines/with-inlines.d.ts

@@ -0,0 +1,5 @@
+import { BaseEditor } from 'slate';
+import { HistoryEditor } from 'slate-history';
+import { ReactEditor } from 'slate-react';
+declare const withInlines: (editor: BaseEditor & ReactEditor & HistoryEditor, id: string) => BaseEditor & ReactEditor & HistoryEditor;
+export default withInlines;

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

@@ -0,0 +1,18 @@
+interface Props {
+    /** The id of the rich text editor */
+    id?: string;
+    /** The default value of the rich text editor */
+    value?: string;
+    /** The placeholder text of the rich text editor */
+    placeholder?: string;
+    /** An optional event handler, called when the rich text editor is changed */
+    onChange?: (value: string) => void;
+    /** Optional autoFocus */
+    autoFocus?: boolean;
+    /** Optional aria invalid */
+    'aria-invalid'?: boolean;
+    /**  Optional aria error message */
+    'aria-errormessage'?: string;
+}
+declare const RichTextEditor: ({ id, value, placeholder, onChange, autoFocus, ...props }: Props) => import("react/jsx-runtime").JSX.Element | null;
+export default RichTextEditor;

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

@@ -0,0 +1,24 @@
+import { BaseElement, BaseText, Descendant } from 'slate';
+export interface BaseProps {
+    className?: string;
+    [key: string]: unknown;
+}
+export type BlockOptionType = 'block_quote' | 'link' | 'list_item' | 'ol_list' | 'ul_list' | 'paragraph' | 'span';
+export interface TypeElement extends BaseElement {
+    type: BlockOptionType;
+}
+export type MarkOptionType = 'bold' | 'italic' | 'strikeThrough';
+export interface TypeText extends BaseText {
+    bold?: boolean;
+    italic?: boolean;
+    strikeThrough?: boolean;
+}
+export type OptionTypes = {
+    format: BlockOptionType | MarkOptionType;
+    hasDivider?: boolean;
+};
+export type LinkElement = {
+    type: 'link';
+    link: string;
+    children: Descendant[];
+};

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/buttons/button-wrapper/button-wrapper.d.ts

@@ -3,10 +3,14 @@ import { ButtonPropsType } from './../button';
 interface Props {
     /** The props for each button */
     buttons: ButtonPropsType[];
+    /** Optional props for each button's wrapper */
+    wrappers?: {
+        className?: string;
+    }[];
     /** Additional classes */
     className?: string;
 }
-declare const ButtonWrapper: ({ buttons, className, ...props }: Props) => React.DetailedReactHTMLElement<{
+declare const ButtonWrapper: ({ buttons, wrappers, className, ...props }: Props) => React.DetailedReactHTMLElement<{
     children: JSX.Element[];
     className: string;
 }, HTMLElement>;

package/general/index.d.ts

@@ -2,6 +2,7 @@ export * from './buttons';
 export * from './divider';
 export * from './image-container';
 export * from './link';
+export * from './portal';
 export * from './progress-tracker';
 export * from './responsive-image';
 export * from './return-to-nav-button';

package/general/link/link.d.ts

@@ -10,12 +10,18 @@ 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;
+    /** Function to be called when key is pressed */
+    onKeyDown?: ((e?: React.KeyboardEvent<HTMLElement>) => void) | undefined;
     /** GTM event context */
     gtmContext?: string;
     /** GTM event type */
     gtmType?: string;
     /** Target for link */
     target?: '_blank' | '_self' | '_parent' | '_top';
+    /** The tab index of the link, e.g. in case we're setting up event handlers to move the focus on arrow press and want to remove the default tabability of the link */
+    tabIndex?: number;
     /** Whether link should be disabled */
     disabled?: boolean;
     /** An ARIA label for the link */

package/general/portal/index.d.ts

@@ -0,0 +1 @@
+export { default as Portal } from './portal';

package/general/portal/portal.d.ts

@@ -0,0 +1,5 @@
+import { ReactNode } from 'react';
+declare const Portal: ({ children }: {
+    children?: ReactNode;
+}) => import("react").ReactPortal | null;
+export default Portal;

package/general/tooltip/tooltip.d.ts

@@ -1,11 +1,37 @@
 import React from 'react';
 interface Props {
+    /** Optional styling */
+    styling?: {
+        /** Whether the tooltip has extra padding */
+        extraPadding?: boolean;
+        /** Whether the tooltip has a pointer */
+        hasPointer?: false | 'top' | 'bottom';
+        /** Whether the tooltip has a form */
+        hasForm?: boolean;
+    };
     /** If the tooltip is open or not */
     isOpen?: boolean;
     /** If the content is loading or not */
     isLoading?: boolean;
     /** The content to show in the tooltip */
     children?: React.ReactNode | JSX.Element | string;
+    /** Additional classes */
+    className?: string;
+    /** Optional functions */
+    functions?: {
+        onBlur?: () => void;
+    };
+    /** Optional callbacks */
+    callbacks?: {
+        /** The callback to fire when the tooltip is opened */
+        onOpen?: () => void;
+        /** The callback to fire when the tooltip is closed */
+        onClose?: () => void;
+    };
+    /** Whether the tooltip is hidden from screen readers or not */
+    'aria-hidden'?: boolean;
+    /** The id of the tooltip */
+    id?: string;
 }
-declare const Tooltip: ({ isOpen, isLoading, children }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const Tooltip: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLElement | null>>;
 export default Tooltip;

package/helpers/intl.d.ts

@@ -132,6 +132,7 @@ export declare const checkIntlPathExists: (path: string, language?: {
     discussion_likes_more: string;
     discussion_likes_like: string;
     discussion_likes_unlike: string;
+    discussion_likes_show: string;
     discussion_moreMenu_edit: string;
     discussion_moreMenu_delete: string;
     discussion_moreMenu_report: string;
@@ -219,6 +220,22 @@ export declare const checkIntlPathExists: (path: string, language?: {
     ratings_low: string;
     ratings_high: string;
     ratings_success: string;
+    richTextEditor_placeholder: string;
+    richTextEditor_toolbar: string;
+    richTextEditor_bold: string;
+    richTextEditor_italic: string;
+    richTextEditor_strikeThrough: string;
+    richTextEditor_link: string;
+    richTextEditor_link_placeholder: string;
+    richTextEditor_link_error_required: string;
+    richTextEditor_link_open: string;
+    richTextEditor_link_open_text: string;
+    richTextEditor_link_edit: string;
+    richTextEditor_link_remove: string;
+    richTextEditor_link_button: string;
+    richTextEditor_ol_list: string;
+    richTextEditor_ul_list: string;
+    richTextEditor_block_quote: string;
     search_label: string;
     search_placeholder: string;
     search_clear: string;

package/helpers/validation.d.ts

@@ -1,4 +1,4 @@
-export declare const valueIsNotEmpty: (value: string) => boolean;
+export declare const valueIsNotEmpty: (value?: string) => boolean;
 export declare const passwordValidator: (password: string) => {
     isValid: boolean;
     matchingRules: {