@apolitical/component-library 5.2.2 → 5.3.1

package/discussion/components/add-post/add-post.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
 import type { IDiscussionForm } from '../../../discussion/components/form';
+import { ICategory } from '../../shared';
 interface Props {
     /** Whether the form should be displayed as a card */
     isCard?: boolean;
@@ -7,6 +8,8 @@ interface Props {
     parentId?: string;
     /** Props for the form - this uses everything the `DiscussionForm` component does */
     form: IDiscussionForm;
+    /** The categories to show in the form */
+    categories?: ICategory[];
     /** Details about what a user needs to have to be able to access the form */
     membershipRequiredToPost: {
         /** Whether the user needs to be a member of the community to post */

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

@@ -1,5 +1,6 @@
 import { type ListMembers, ClickMentionFallback } from '../../../form';
 import { DiscussionCreateContentFunction, IDiscussionContent, IListMemberData, IMentions } from './../../discussion';
+import { ICategory } from '../../shared';
 export interface IDiscussionFormMeta {
     /** Whether the form data is still loading */
     isLoading?: boolean;
@@ -23,6 +24,10 @@ export interface IDiscussionFormMeta {
     };
     /** Whether title text should show above the form */
     showTitle?: boolean;
+    /** What category options should be made available for the form */
+    postCategories?: ICategory[];
+    /** Whether the post type should show */
+    showPostType?: boolean;
     /** Whether the community guidelines text should show beneath the form */
     showGuidelines?: boolean;
     /** Whether to show a divider before the buttons */

package/discussion/components/post/post.d.ts

@@ -87,10 +87,15 @@ export interface IDiscussionPostProps {
     isCommunity?: boolean;
     /** Whether to show badges and the scope of the badge */
     badges?: IBadgesOption;
+    /** Categories for the community */
+    categories?: {
+        name: string;
+        slug: string;
+    }[];
     /** The base path, used for slugs */
     basePath: string;
     /** The ID of the parent, used for slugs */
     parentId: string;
 }
-declare const Post: ({ element, content, userHasPermissions, userHasOwnerPermissions, isLoading, originalAuthorId, forceHide, functions, links, className, gtmContext, children, isTruncated, styling: { showShareLinkButton, showMoreMenuButton }, setFocus, isCommunity, badges, basePath, parentId, }: IDiscussionPostProps) => import("react/jsx-runtime").JSX.Element;
+declare const Post: ({ element, content, userHasPermissions, userHasOwnerPermissions, isLoading, originalAuthorId, forceHide, functions, links, className, gtmContext, children, isTruncated, styling: { showShareLinkButton, showMoreMenuButton }, setFocus, isCommunity, badges, categories, basePath, parentId, }: IDiscussionPostProps) => import("react/jsx-runtime").JSX.Element;
 export default Post;

package/discussion/feeds/activities-feed/activities-feed.d.ts

@@ -12,6 +12,11 @@ interface Props {
     isMember: boolean;
     /** Whether the user is an owner of the community */
     isOwner: boolean;
+    /** The categories for the community */
+    categories: {
+        name: string;
+        slug: string;
+    }[];
     /** Functions for the activities query */
     functions: {
         /** Query functions for the activities */

package/discussion/feeds/activities-feed/cache/hooks/list/list.hook.d.ts

@@ -3,9 +3,12 @@ import type { ICache, ICachePage } from '../..';
 export interface IListActivitiesArgs {
     queryFn: (_: unknown) => Promise<ICachePage>;
     queryKey: QueryKey;
-    rankingMethod?: string;
+    filterOption?: {
+        id: string;
+        type: string;
+    };
 }
-export declare function useListActivities({ queryFn, queryKey, rankingMethod, }: IListActivitiesArgs): {
+export declare function useListActivities({ queryFn, queryKey, filterOption, }: IListActivitiesArgs): {
     activities: import('../../../../../../discussion/shared').IActivity[];
     error: Error | null;
     isLoading: boolean;

package/discussion/feeds/activities-feed/mocks/activities-feed.mock.d.ts

@@ -16,6 +16,7 @@ export declare const activitiesFeedMock: {
             };
         };
         title: string;
+        categories: string[];
         content: string;
         feed_id: string;
         foreign_id: string;
@@ -124,6 +125,7 @@ export declare const activitiesFeedMock: {
             };
         };
         title: string;
+        categories: string[];
         content: string;
         feed_id: string;
         foreign_id: string;
@@ -155,6 +157,7 @@ export declare const activitiesFeedMock: {
                 badges?: undefined;
             };
         };
+        categories: string[];
         content: string;
         feed_id: string;
         foreign_id: string;
@@ -229,6 +232,7 @@ export declare const activitiesFeedMock: {
         target: string;
         time: string;
         verb: string;
+        categories?: undefined;
     })[];
     next: string;
     duration: string;

package/discussion/sections/activity-section/activity-section.d.ts

@@ -22,6 +22,10 @@ export interface IActivitySectionProps {
         leave: () => Promise<void>;
     };
     profile: IProfileFormProps;
+    categories?: {
+        name: string;
+        slug: string;
+    }[];
 }
 declare const ActivitySection: React.FC<IActivitySectionProps>;
 export default ActivitySection;

package/discussion/sections/activity-section/mocks/activity-section.mock.d.ts

@@ -17,6 +17,7 @@ export declare const activitySectionMock: {
             };
         };
     };
+    categories: string[];
     content: string;
     feed_id: string;
     foreign_id: string;

package/discussion/shared/helpers/activity.helper.d.ts

@@ -3,6 +3,7 @@ import type { IActivity, IReaction } from '..';
 interface IPrepareActivityArgs {
     title?: string;
     content?: string;
+    categories?: string;
 }
 interface IEnrichActivityArgs {
     activity: IActivity | Partial<IActivity>;
@@ -17,9 +18,10 @@ interface IDecrementActivityLikesArgs {
     activity: IActivity;
     user?: IUserContext;
 }
-export declare function prepareActivity({ title, content }: IPrepareActivityArgs): {
+export declare function prepareActivity({ title, content, categories }: IPrepareActivityArgs): {
     title: string | undefined;
     content: string | undefined;
+    categories: string[];
     id: string;
     time: string;
     verb: string;

package/discussion/shared/interfaces/activity.interface.d.ts

@@ -1,6 +1,7 @@
 import type { FlatActivityEnriched } from 'getstream';
 export interface IActivity extends FlatActivityEnriched {
     content: string;
+    categories?: string[];
     feed_id?: string;
     title: string;
     total_replies?: number;

package/discussion/shared/interfaces/community.category.interface.d.ts

@@ -0,0 +1,4 @@
+export interface ICategory {
+    name: string;
+    slug: string;
+}

package/discussion/shared/interfaces/discussion.interface.d.ts

@@ -24,6 +24,8 @@ export interface IFullDiscussionContent extends IDiscussionContent {
     body?: string;
     /** The author of the post */
     author: MemberProps;
+    /** The post categories */
+    categories?: string[];
     createdAt: Date | string;
     /** The number of likes to display */
     likes?: number;

package/discussion/shared/interfaces/index.d.ts

@@ -1,4 +1,5 @@
 export * from './activity.interface';
+export * from './community.category.interface';
 export * from './context.interface';
 export * from './discussion.interface';
 export * from './reaction.interface';

package/form/components/form/components/fields/checkbox/checkbox.d.ts

@@ -1,11 +1,11 @@
 import React from 'react';
 import { IField } from '../../../form.types';
-export declare const Checkbox: ({ className, disabled, element, functions: allFunctions, id, inputRef: ref, intlPath, label, shownValue: value, type, value: isChecked, ...props }: IField) => React.DOMElement<{
+export declare const Checkbox: ({ className, disabled, element, functions: allFunctions, id, inputRef: ref, intlPath, label, shownValue: value, type, value: isChecked, accessibilityOptions: { checkboxes: { navigateWithArrowKeys } }, ...props }: IField) => React.DOMElement<{
     onMultiSelectSubmit?: ((arg1: import("../../../form.types").FormValues) => void) | undefined;
     onBlur?: (() => void) | undefined;
     onFocus?: (() => void) | undefined;
     onKeyInput?: (<T>(arg1: import("../../../form.types").FormValues) => Promise<T>) | undefined;
-    onKeyDown?: ((e: React.KeyboardEvent<HTMLElement>) => void) | undefined;
+    onKeyDown: ((e: React.KeyboardEvent<HTMLElement>) => void) | undefined;
     submitForm?: ((arg: import("../../../form.types").IFormValues) => void) | undefined;
     'aria-describedby'?: string | undefined;
     'aria-errormessage'?: string | undefined;

package/form/components/form/components/fields/input/input.d.ts

@@ -15,6 +15,11 @@ export declare const Input: ({ className, element, id, inputRef: ref, functions,
     value: InputValues;
     placeholder: string | undefined;
     autoFocus: boolean | undefined;
+    accessibilityOptions?: {
+        checkboxes?: {
+            navigateWithArrowKeys?: boolean | undefined;
+        } | undefined;
+    } | undefined;
     'aria-describedby'?: string | undefined;
     'aria-errormessage'?: string | undefined;
     'aria-invalid'?: boolean | undefined;

package/form/components/form/components/fields/multiple-options/multiple-options.d.ts

@@ -1,3 +1,3 @@
 import { IField } from '../../../form.types';
-export declare const MultipleOptions: ({ className, functions, intlPath, id: groupId, label, multiSelect, name, options, required, type, value, ...props }: IField) => import("react/jsx-runtime").JSX.Element;
+export declare const MultipleOptions: ({ className, functions, intlPath, id: groupId, label, multiSelect, name, options, required, type, value, accessibilityOptions, ...props }: IField) => import("react/jsx-runtime").JSX.Element;
 export default MultipleOptions;

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

@@ -82,6 +82,14 @@ export interface IFieldFunctions {
     submitForm?: (arg: IFormValues) => void;
 }
 export interface IField {
+    /** Additional accessibility configuration */
+    accessibilityOptions?: {
+        /** Additional options for checkboxes */
+        checkboxes?: {
+            /** Whether the field should be navigable with arrow keys */
+            navigateWithArrowKeys?: boolean;
+        };
+    };
     /** Optional ID of the element which describes this field, for screen readers */
     'aria-describedby'?: string;
     /** Optional ID of the element which provides an error message for this field */

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

@@ -1,6 +1,7 @@
 import { Dispatch } from 'react';
 import { Point } from 'slate';
 import { IListMemberData } from '../../../../../discussion';
+import type { IEnrichedUrlData } from '../../../../../navigation';
 import { ReportError, IMentionPopOver } from './../../rich-text-editor.types';
 declare const RichTextEditorContext: import("react").Context<{
     /** The id of the editor */
@@ -19,8 +20,12 @@ declare const RichTextEditorContext: import("react").Context<{
     lastAnchor: Point | null;
     /** Whether the editor is inside a modal, used to handle portals for focus trap */
     isInOverlay?: string | false | undefined;
+    /** The data for the first link, to be displayed in the EnrichedUrl component. `undefined` is not set, `false` will not show the enriched url. (For cases where the user has manually removed it.) */
+    enrichedUrl?: IEnrichedUrlData | false | undefined;
     /** An optional function to call when a mention is inserted */
     onMention?: ((value?: IListMemberData) => void) | undefined;
+    /** The function to get metadata about a link */
+    getLinkPreview?: ((url: string) => Promise<IEnrichedUrlData>) | undefined;
     /** The function to update the state */
     dispatch: Dispatch<any>;
     /** The function to report an error */

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

@@ -1,3 +1,4 @@
 import { BaseEditor } from 'slate';
 export declare const getSelectedText: (editor: BaseEditor) => string | null;
 export declare const getAllText: (editor: BaseEditor) => string;
+export declare const firstLinkData: (editor: BaseEditor) => string | null;

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

@@ -12,8 +12,8 @@ export default function transform<T extends InputNodeTypes>(node: MdastNode, opt
     position?: any;
     ordered?: boolean | undefined;
     checked?: any;
-    depth?: 1 | 2 | 3 | 4 | 5 | 6 | undefined;
     lang?: string | undefined;
+    depth?: 1 | 2 | 3 | 4 | 5 | 6 | undefined;
     spread?: any;
     indent?: any;
     text: string | undefined;

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

@@ -1,3 +1,4 @@
+export * from './with-link-removal-listener';
 export * from './with-linlines';
 export * from './with-mentions';
 export * from './without-empty-links';

package/form/components/rich-text-editor/plugins/with-link-removal-listener/index.d.ts

@@ -0,0 +1 @@
+export { default as withLinkRemovalListener } from './with-link-removal-listener';

package/form/components/rich-text-editor/plugins/with-link-removal-listener/with-link-removal-listener.d.ts

@@ -0,0 +1,6 @@
+import { BaseEditor } from 'slate';
+import { HistoryEditor } from 'slate-history';
+import { ReactEditor } from 'slate-react';
+import { ReportError } from './../../rich-text-editor.types';
+declare const withLinkRemovalListener: (editor: BaseEditor & ReactEditor & HistoryEditor, reportError: ReportError) => BaseEditor & ReactEditor & HistoryEditor;
+export default withLinkRemovalListener;

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

@@ -1,43 +1,3 @@
-import type { IMentions, IListMemberData } from '../../../discussion/discussion';
-import { ListMembers, ReportError, ClickMentionFallback } from './rich-text-editor.types';
-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;
-    /** The maximum length of the rich text editor */
-    maxLength?: number;
-    /** Information about the rich text editor */
-    meta?: {
-        /** Whether the rich text editor is inside a modal */
-        isInOverlay?: false | 'string';
-    };
-    /** Optional functions */
-    functions?: {
-        /** An optional function to get a filtered list of members when the user starts typing a mention */
-        listMembers?: ListMembers;
-        /** An optional function to call when the user clicks the mention fallback, e.g. to show an invite modal */
-        clickMentionFallback?: ClickMentionFallback;
-        /** An optional event handler, called when the rich text editor is changed */
-        onChange?: (value: string) => void;
-        /** An optional function to call when a mention is inserted */
-        onMention?: (value?: IListMemberData) => void;
-        /** An optional event handler, called when the rich text editor reports an error */
-        reportError?: ReportError;
-    };
-    /** Optional autoFocus */
-    autoFocus?: boolean;
-    /** Optional aria invalid */
-    'aria-invalid'?: boolean;
-    /**  Optional aria error message */
-    'aria-errormessage'?: string;
-    /** Optional data for the editor */
-    data?: {
-        /** Optional mentions */
-        mentions?: IMentions;
-    };
-}
-declare const RichTextEditor: ({ id, value, placeholder, maxLength, meta, functions, autoFocus, data, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
+import { IRTEProps } from './rich-text-editor.types';
+declare const RichTextEditor: ({ id, value, placeholder, maxLength, meta, functions, autoFocus, data, ...props }: IRTEProps) => import("react/jsx-runtime").JSX.Element;
 export default RichTextEditor;

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

@@ -1,6 +1,69 @@
-import { BaseElement, BaseText, Descendant, Range } from 'slate';
-import type { IListMemberData } from '../../../discussion';
+import { BaseElement, BaseText, Descendant, Point, Range } from 'slate';
+import type { IListMemberData, IMentions } from '../../../discussion';
 import type { MemberDetailsProps } from '../../../user';
+import type { IEnrichedUrlData } from '../../../navigation';
+export interface IRTEProps {
+    /** 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;
+    /** The maximum length of the rich text editor */
+    maxLength?: number;
+    /** Information about the rich text editor */
+    meta?: {
+        /** Whether the rich text editor is inside a modal */
+        isInOverlay?: false | 'string';
+    };
+    /** Optional functions */
+    functions?: {
+        /** An optional function to get a filtered list of members when the user starts typing a mention */
+        listMembers?: ListMembers;
+        /** An optional function to call when the user clicks the mention fallback, e.g. to show an invite modal */
+        clickMentionFallback?: ClickMentionFallback;
+        /** An optional function to get a preview of a link */
+        getLinkPreview?: (url: string) => Promise<IEnrichedUrlData>;
+        /** An optional event handler, called when the rich text editor is changed */
+        onChange?: (value: string) => void;
+        /** An optional function to call when a mention is inserted */
+        onMention?: (value?: IListMemberData) => void;
+        /** An optional event handler, called when the rich text editor reports an error */
+        reportError?: ReportError;
+    };
+    /** Optional autoFocus */
+    autoFocus?: boolean;
+    /** Optional aria invalid */
+    'aria-invalid'?: boolean;
+    /**  Optional aria error message */
+    'aria-errormessage'?: string;
+    /** Optional data for the editor */
+    data?: {
+        /** Optional mentions */
+        mentions?: IMentions;
+        /** Optional data about the first link, to be displayed in the EnrichedUrl component */
+        link?: IEnrichedUrlData;
+    };
+}
+export interface IRTEInitialState {
+    editorKey: string | null;
+    originalValue: string | null;
+    initialValue: Descendant[] | null;
+    tabbableOption: string;
+    openTooltip: string | null;
+    showLinkEditor: boolean;
+    mentionPopover: IMentionPopOver;
+    lastAnchor: Point | null;
+    stringValue: string;
+    lastKey: string | null;
+    hasInteracted: boolean;
+    hasLoaded: boolean;
+    enrichedUrl: IEnrichedUrlData | false | undefined;
+}
+export interface IRTEReducer {
+    type: keyof IRTEInitialState;
+    value: any;
+}
 export declare enum Formatting {
     blockquote = "block_quote",
     bold = "bold",

package/helpers/intl.d.ts

@@ -127,6 +127,8 @@ export declare const checkIntlPathExists: (path: string, language?: {
     discussionFormCard_overlay_text: string;
     discussionFormCard_overlay_cta_discard: string;
     discussionFormCard_overlay_cta_continue: string;
+    discussion_form_postType_label: string;
+    'discussion_form__postType_no-category': string;
     discussion_form_title: string;
     discussion_form_titleField_label: string;
     discussion_form_titleField_placeholder: string;
@@ -286,6 +288,9 @@ export declare const checkIntlPathExists: (path: string, language?: {
     richTextEditor_link_edit: string;
     richTextEditor_link_remove: string;
     richTextEditor_link_button: string;
+    richTextEditor_link_enrichedUrl_aria: string;
+    richTextEditor_link_enrichedUrl_aria_fallback: string;
+    richTextEditor_link_enrichedUrl_aria_live: string;
     richTextEditor_ol_list: string;
     richTextEditor_ul_list: string;
     richTextEditor_block_quote: string;