@apolitical/component-library 7.0.2 → 7.0.3-ac.1

package/styles/base/buttons/_icons.scss

@@ -25,6 +25,7 @@ $icons: ('arrow_left', (d, d, 3, 8), (d, d, 3, 8), (d, d, 4, 7)),
   ),
   ('chevron_left', (16, 16, 4, 8), (14, 14, 3, 8), (14, 14, d, d)),
   ('chevron_right', (16, 16, 4, 8), (14, 14, 3, 8), (14, 14, d, d)),
+  ('clock', (16, 16, 4, 8), (14, 14, 3, 8), (14, 14, d, d)),
   ('close', (48, 48, 0, 0), (32, 32, 0, 0), (24, 24, 0, 0)),
   ('ellipsis', (48, 48, 0, 0), (32, 32, 0, 0), (16, 16, 0, 0)),
   ('flag', (22, 22, 0, 10), (18, 18, 1, d), (d, d, 3, 10)),
@@ -49,4 +50,6 @@ $icons: ('arrow_left', (d, d, 3, 8), (d, d, 3, 8), (d, d, 4, 7)),
   ('star_empty', (16, 16, 0, 0), (d, d, 0, 0), (16, 16, 0, 0)),
   ('tick', (14, 11, 8, 10), (14, 11, 5, 8), (9, 7, 6, 6)),
   ('trash', (22, 22, 0, 10), (18, 18, 1, d), (d, d, 3, 10)),
+  ('user', (16, 16, 4, 8), (14, 14, 3, 8), (14, 14, d, d)),
+  ('user-plus', (16, 16, 4, 8), (14, 14, 3, 8), (14, 14, d, d)),
   ('unpin', (22, 22, 0, 10), (18, 18, 1, d), (d, d, 3, 10));

package/user/member/components/connection-cta.d.ts

@@ -0,0 +1,13 @@
+import { IMemberComponentProps } from '../member.types';
+export interface Props {
+    functions: {
+        onAccept?: () => void;
+        onDecline?: () => void;
+        onCancel?: () => void;
+        onRemove?: () => void;
+        onRequest?: () => void;
+    };
+    connection: IMemberComponentProps['connection'];
+    topLevelButton?: boolean;
+}
+export declare const ConnectionCta: ({ functions, connection, topLevelButton, }: Props) => import("react/jsx-runtime").JSX.Element;

package/user/member/components/index.d.ts

@@ -0,0 +1 @@
+export * from './connection-cta';

package/user/member/index.d.ts

@@ -1,3 +1,3 @@
 export { default as Member } from './member';
-export type { IMemberComponentProps, MemberProps, MemberDetailsProps, } from './member.types';
+export type { ConnectionStatusType, ConnectionDirectionType, IMemberComponentProps, MemberProps, MemberDetailsProps, } from './member.types';
 export { getMember } from './member.helpers';

package/user/member/member.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { IMemberComponentProps } from './member.types';
-declare const Member: ({ element, member: memberDetails, alt, additionalContent, styling, functions, gtmContext, gtmType, className, badges, ...props }: IMemberComponentProps) => React.DetailedReactHTMLElement<{
+declare const Member: ({ element, member: memberDetails, alt, additionalContent, styling, functions, gtmContext, gtmType, className, badges, connection, ...props }: IMemberComponentProps) => React.DetailedReactHTMLElement<{
     children: import("react/jsx-runtime").JSX.Element;
     onClick?: ((e: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
     className: string;

package/user/member/member.types.d.ts

@@ -27,6 +27,18 @@ export type MemberDetailsProps = {
     badges?: IBadgesObject;
 };
 export type MemberProps = 'apolitical' | 'community' | 'deleted' | MemberDetailsProps;
+export declare enum ConnectionStatusType {
+    Accepted = "accepted",
+    Cancelled = "cancelled",
+    Declined = "declined",
+    Pending = "pending",
+    Removed = "removed"
+}
+export type ConnectionType = ConnectionStatusType.Accepted | ConnectionStatusType.Cancelled | ConnectionStatusType.Declined | ConnectionStatusType.Pending | ConnectionStatusType.Removed;
+export declare enum ConnectionDirectionType {
+    In = "in",
+    Out = "out"
+}
 export interface IMemberComponentProps {
     /** The element to render around the content */
     element?: 'li' | 'div';
@@ -48,6 +60,10 @@ export interface IMemberComponentProps {
     };
     /** Whether to show badges and the scope of the badge */
     badges?: IBadgesOption;
+    connection?: {
+        status: ConnectionStatusType | undefined;
+        direction: ConnectionDirectionType | undefined;
+    };
     /**  Optional styling */
     styling?: {
         /** The size of the component */
@@ -65,6 +81,13 @@ export interface IMemberComponentProps {
         onClick?: (e: React.MouseEvent) => void;
         /** Props for the profile modal */
         profile?: IProfileFormProps;
+        connections?: {
+            onAccept?: () => void;
+            onDecline?: () => void;
+            onCancel?: () => void;
+            onRemove?: () => void;
+            onRequest?: () => void;
+        };
     };
     /** The optional test ID for Jest */
     'data-testid'?: string;