dce-reactkit 3.8.7 → 3.9.0-beta-loading-modal.1

package/dist/cjs/types/components/Dropdown.d.ts

@@ -1,32 +0,0 @@
-/**
- * A simple dropdown menu
- * @author Alessandra De Lucas
- * @author Yuen Ler Chow
- * @author Gabe Abrams
- */
-import React from 'react';
-import Variant from '../types/Variant';
-import DropdownItemType from '../types/DropdownItemType';
-type Props = {
-    items: DropdownItem[];
-    dropdownButton: {
-        ariaLabel: string;
-        id: string;
-        content?: React.ReactNode;
-        variant?: Variant;
-    };
-};
-type DropdownItem = ({
-    type: DropdownItemType.Header;
-    content: React.ReactNode;
-} | {
-    type: DropdownItemType.Divider;
-} | {
-    type: DropdownItemType.Item;
-    content: React.ReactNode;
-    ariaLabel: string;
-    id: string;
-    onClick: () => void;
-});
-declare const Dropdown: React.FC<Props>;
-export default Dropdown;

package/dist/cjs/types/helpers/validators/ChicagoTitleCase.d.ts

@@ -1,9 +0,0 @@
-/**
- * This function converts a string to title case based on Chicago Title Case
- * Style rules.
- * @author Leisha Bhandari
- * @param input: The input string that needs to be converted to Chicago title
- *               case.
- * @returns Input string converted to title case
- */
-declare const chicagoTitleCase: (input: string) => string;

package/dist/cjs/types/helpers/validators/validURL.d.ts

@@ -1,8 +0,0 @@
-/**
- * This function checks if a given input string is a valid URL.
- * @author Leisha Bhandari
- * @param URL: The input string that needs checked as a URL or not.
- * @returns A true boolean value if the input string is a valid URL, and a false
- *          boolean value if the input string is a invalid URL
- */
-declare function isValid(url: string): boolean;

package/dist/cjs/types/helpers/visitEndpointOnAnotherServer/index.d.ts

@@ -1,22 +0,0 @@
-/**
- * Send a server-to-server request from this sever to another server that uses
- *   dce-reactkit [for server only]
- * @author Gabe Abrams
- * @param opts object containing all arguments
- * @param opts.path - the path of the other server's endpoint
- * @param [opts.method=GET] - the method of the endpoint
- * @param [opts.params] - query/body parameters to include
- * @param [opts.headers] - headers to include
- * @returns response from server
- */
-declare const visitEndpointOnAnotherServer: (opts: {
-    path: string;
-    method?: "GET" | "POST" | "DELETE" | "PUT" | undefined;
-    params?: {
-        [x: string]: any;
-    } | undefined;
-    headers?: {
-        [x: string]: any;
-    } | undefined;
-}) => Promise<any>;
-export default visitEndpointOnAnotherServer;

package/dist/cjs/types/helpers/visitEndpointOnAnotherServer/sendServerToServerRequest.d.ts

@@ -1,33 +0,0 @@
-/**
- * Sends and retries an http request
- * @author Gabriel Abrams
- * @param opts object containing all arguments
- * @param opts.path path to send request to
- * @param [opts.host] host to send request to
- * @param [opts.method=GET] http method to use
- * @param [opts.params] body/data to include in the request
- * @param [opts.headers] headers to include in the request
- * @param [opts.sendCrossDomainCredentials=true if in development mode] if true,
- *   send cross-domain credentials even if not in dev mode
- * @param [opts.responseType=JSON] expected response type
- * @returns { body, status, headers } on success
- */
-declare const sendServerToServerRequest: (opts: {
-    path: string;
-    host?: string | undefined;
-    method?: "GET" | "POST" | "DELETE" | "PUT" | undefined;
-    params?: {
-        [x: string]: any;
-    } | undefined;
-    headers?: {
-        [x: string]: any;
-    } | undefined;
-    responseType?: "Text" | "JSON" | undefined;
-}) => Promise<{
-    body: any;
-    status: number;
-    headers: {
-        [x: string]: any;
-    };
-}>;
-export default sendServerToServerRequest;

package/dist/cjs/types/types/DropdownItemType.d.ts

@@ -1,6 +0,0 @@
-declare enum DropdownItemType {
-    Header = "Header",
-    Divider = "Divider",
-    Item = "Item"
-}
-export default DropdownItemType;

package/dist/esm/types/components/Dropdown.d.ts

@@ -1,32 +0,0 @@
-/**
- * A simple dropdown menu
- * @author Alessandra De Lucas
- * @author Yuen Ler Chow
- * @author Gabe Abrams
- */
-import React from 'react';
-import Variant from '../types/Variant';
-import DropdownItemType from '../types/DropdownItemType';
-type Props = {
-    items: DropdownItem[];
-    dropdownButton: {
-        ariaLabel: string;
-        id: string;
-        content?: React.ReactNode;
-        variant?: Variant;
-    };
-};
-type DropdownItem = ({
-    type: DropdownItemType.Header;
-    content: React.ReactNode;
-} | {
-    type: DropdownItemType.Divider;
-} | {
-    type: DropdownItemType.Item;
-    content: React.ReactNode;
-    ariaLabel: string;
-    id: string;
-    onClick: () => void;
-});
-declare const Dropdown: React.FC<Props>;
-export default Dropdown;

package/dist/esm/types/helpers/validators/ChicagoTitleCase.d.ts

@@ -1,9 +0,0 @@
-/**
- * This function converts a string to title case based on Chicago Title Case
- * Style rules.
- * @author Leisha Bhandari
- * @param input: The input string that needs to be converted to Chicago title
- *               case.
- * @returns Input string converted to title case
- */
-declare const chicagoTitleCase: (input: string) => string;

package/dist/esm/types/helpers/validators/validURL.d.ts

@@ -1,8 +0,0 @@
-/**
- * This function checks if a given input string is a valid URL.
- * @author Leisha Bhandari
- * @param URL: The input string that needs checked as a URL or not.
- * @returns A true boolean value if the input string is a valid URL, and a false
- *          boolean value if the input string is a invalid URL
- */
-declare function isValid(url: string): boolean;

package/dist/esm/types/helpers/visitEndpointOnAnotherServer/index.d.ts

@@ -1,22 +0,0 @@
-/**
- * Send a server-to-server request from this sever to another server that uses
- *   dce-reactkit [for server only]
- * @author Gabe Abrams
- * @param opts object containing all arguments
- * @param opts.path - the path of the other server's endpoint
- * @param [opts.method=GET] - the method of the endpoint
- * @param [opts.params] - query/body parameters to include
- * @param [opts.headers] - headers to include
- * @returns response from server
- */
-declare const visitEndpointOnAnotherServer: (opts: {
-    path: string;
-    method?: "GET" | "POST" | "DELETE" | "PUT" | undefined;
-    params?: {
-        [x: string]: any;
-    } | undefined;
-    headers?: {
-        [x: string]: any;
-    } | undefined;
-}) => Promise<any>;
-export default visitEndpointOnAnotherServer;

package/dist/esm/types/helpers/visitEndpointOnAnotherServer/sendServerToServerRequest.d.ts

@@ -1,33 +0,0 @@
-/**
- * Sends and retries an http request
- * @author Gabriel Abrams
- * @param opts object containing all arguments
- * @param opts.path path to send request to
- * @param [opts.host] host to send request to
- * @param [opts.method=GET] http method to use
- * @param [opts.params] body/data to include in the request
- * @param [opts.headers] headers to include in the request
- * @param [opts.sendCrossDomainCredentials=true if in development mode] if true,
- *   send cross-domain credentials even if not in dev mode
- * @param [opts.responseType=JSON] expected response type
- * @returns { body, status, headers } on success
- */
-declare const sendServerToServerRequest: (opts: {
-    path: string;
-    host?: string | undefined;
-    method?: "GET" | "POST" | "DELETE" | "PUT" | undefined;
-    params?: {
-        [x: string]: any;
-    } | undefined;
-    headers?: {
-        [x: string]: any;
-    } | undefined;
-    responseType?: "Text" | "JSON" | undefined;
-}) => Promise<{
-    body: any;
-    status: number;
-    headers: {
-        [x: string]: any;
-    };
-}>;
-export default sendServerToServerRequest;

package/dist/esm/types/types/DropdownItemType.d.ts

@@ -1,6 +0,0 @@
-declare enum DropdownItemType {
-    Header = "Header",
-    Divider = "Divider",
-    Item = "Item"
-}
-export default DropdownItemType;

package/src/components/Dropdown.tsx

@@ -1,317 +0,0 @@
-/**
- * A simple dropdown menu
- * @author Alessandra De Lucas
- * @author Yuen Ler Chow
- * @author Gabe Abrams
- */
-
-// Import React
-import React, { useEffect, useReducer, useRef } from 'react';
-
-// Import helpers
-import combineClassNames from '../helpers/combineClassNames';
-
-// Import shared types
-import Variant from '../types/Variant';
-import DropdownItemType from '../types/DropdownItemType';
-
-// Check dark mode
-import { isDarkModeOn } from '../client/initClient';
-
-/*------------------------------------------------------------------------*/
-/* -------------------------------- Types ------------------------------- */
-/*------------------------------------------------------------------------*/
-
-// Props definition
-type Props = {
-  // List of items in the dropdown menu
-  items: DropdownItem[],
-  // Information about the dropdown button
-  dropdownButton: {
-    // Aria label for accessibility
-    ariaLabel: string,
-    // Unique ID
-    id: string,
-    // Button content
-    content?: React.ReactNode,
-    // Variant
-    variant?: Variant,
-  },
-  // If true, no arrow shows in dropdown
-  // noArrow?: boolean,
-  // Size of dropdown
-  // size?: DropdownSize,
-  // Direction of dropdown
-  // direction?: DropdownDirection,
-};
-
-// Details about a dropdown item
-type DropdownItem = (
-  | {
-    // Header element
-    type: DropdownItemType.Header,
-    // Header content
-    content: React.ReactNode,
-  }
-  | {
-    // Divider element
-    type: DropdownItemType.Divider,
-  }
-  | {
-    // Item from dropdown menu
-    type: DropdownItemType.Item,
-    // Item content
-    content: React.ReactNode,
-    // Item aria label
-    ariaLabel: string,
-    // Unique item ID
-    id: string,
-    // Click function for dropdown item
-    onClick: () => void,
-  }
-);
-
-// Dropdown menu sizes
-// enum DropdownSize {
-//   // Small dropdown size
-//   Small = 'Small',
-//   // Medium dropdown size
-//   Medium = 'Medium',
-//   // Large dropdown size
-//   Large = 'Large',
-// }
-
-// Dropdown menu direction
-// enum DropdownDirection {
-//   // Dropdown menu appears centered
-//   Centered = 'Centered',
-//   // Dropdown menu appears to right of button
-//   Right = 'Right',
-//   // Dropdown menu appears to left of button
-//   Left = 'Left',
-//   // Dropdown menu appears above the button
-//   Up = 'Up',
-//   // Dropdown menu appears below the button
-//   Down = 'Down',
-// }
-
-/*------------------------------------------------------------------------*/
-/* -------------------------------- State ------------------------------- */
-/*------------------------------------------------------------------------*/
-
-/* -------- State Definition -------- */
-
-type State = {
-  // If true, the dropdown menu is open
-  isDropdownOpen: boolean,
-};
-
-/* ------------- Actions ------------ */
-
-// Types of actions
-enum ActionType {
-  // Toggle opening the dropdown menu
-  ToggleDropdown = 'ToggleDropdown',
-  // Close the dropdown menu
-  CloseDropdown = 'CloseDropdown',
-}
-
-// Action definitions
-type Action = (
-  | {
-    type: ActionType.ToggleDropdown,
-  }
-  | {
-    type: ActionType.CloseDropdown,
-  }
-);
-
-/**
- * Reducer that executes actions
- * @author Alessandra De Lucas
- * @author Yuen Ler Chow
- * @param state current state
- * @param action action to execute
- */
-const reducer = (state: State, action: Action): State => {
-  switch (action.type) {
-    case ActionType.ToggleDropdown: {
-      return {
-        ...state,
-        isDropdownOpen: !state.isDropdownOpen,
-      };
-    }
-    case ActionType.CloseDropdown: {
-      return {
-        ...state,
-        isDropdownOpen: false,
-      };
-    }
-    default: {
-      return state;
-    }
-  }
-};
-
-/*------------------------------------------------------------------------*/
-/* ------------------------------ Component ----------------------------- */
-/*------------------------------------------------------------------------*/
-
-const Dropdown: React.FC<Props> = (props) => {
-  /*------------------------------------------------------------------------*/
-  /* -------------------------------- Setup ------------------------------- */
-  /*------------------------------------------------------------------------*/
-
-  /* -------------- Props ------------- */
-
-  // Destructure all props
-  const {
-    dropdownButton,
-    items,
-  } = props;
-
-  /* -------------- State ------------- */
-
-  // Initial state
-  const initialState: State = {
-    isDropdownOpen: false,
-  };
-
-  // Initialize state
-  const [state, dispatch] = useReducer(reducer, initialState);
-
-  // Destructure common state
-  const {
-    isDropdownOpen,
-  } = state;
-
-  /* -------------- Refs -------------- */
-
-  // Initialize refs
-  const dropdownRef = useRef<HTMLDivElement>(null);
-
-  /*------------------------------------------------------------------------*/
-  /* ------------------------- Component Functions ------------------------ */
-  /*------------------------------------------------------------------------*/
-
-  /**
-   * Handle clicking outside of the dropdown menu to close it
-   * @author Yuen Ler Chow
-   * @param event the mouse event
-   */
-  const handleClickOutside = (event: MouseEvent) => {
-    if (
-      // Dropdown has been rendered
-      dropdownRef.current
-      // Click occurred outside the dropdown
-      && !dropdownRef.current.contains(event.target as Element)
-    ) {
-      dispatch({ type: ActionType.CloseDropdown });
-    }
-  };
-
-  /*------------------------------------------------------------------------*/
-  /* ------------------------- Lifecycle Functions ------------------------ */
-  /*------------------------------------------------------------------------*/
-
-  /**
-   * Mount
-   * @author Yuen Ler Chow
-   */
-  useEffect(() => {
-    // Add event listener to close dropdown when clicking outside
-    document.addEventListener('mousedown', handleClickOutside);
-
-    // Cleanup
-    return () => {
-      document.removeEventListener('mousedown', handleClickOutside);
-    };
-  }, []);
-
-  /*----------------------------------------*/
-  /* --------------- Main UI -------------- */
-  /*----------------------------------------*/
-
-  return (
-    <div
-      className="dropdown"
-      ref={dropdownRef}
-      data-bs-theme={isDarkModeOn() ? 'dark' : undefined}
-    >
-      <button
-        className={
-          combineClassNames([
-            'btn dropdown-toggle border',
-            isDropdownOpen && 'show',
-            `btn-${dropdownButton.variant}`,
-            dropdownButton.variant === Variant.Light && 'text-dark',
-          ])
-        }
-        type="button"
-        id={dropdownButton.id}
-        aria-expanded={isDropdownOpen}
-        aria-label={dropdownButton.ariaLabel}
-        onClick={() => {
-          dispatch({
-            type: ActionType.ToggleDropdown,
-          });
-        }}
-      >
-        {
-          dropdownButton.content
-        }
-      </button>
-      <ul
-        className={
-          combineClassNames([
-            'dropdown-menu',
-            isDarkModeOn() && 'dropdown-menu-dark',
-            isDropdownOpen && 'show',
-          ])
-        }
-      >
-        {Object.values(items).map((item) => {
-          if (item.type === DropdownItemType.Header) {
-            return (
-              // TODO: Implement header
-              <span />
-            );
-          }
-          if (item.type === DropdownItemType.Divider) {
-            return (
-              // TODO: Implement divider
-              <span />
-            );
-          }
-          return (
-            <li
-              key={item.id}
-            >
-              <button
-                type="button"
-                aria-label={item.ariaLabel}
-                className="dropdown-item"
-                onClick={(e) => {
-                  e.preventDefault();
-                  dispatch({
-                    type: ActionType.CloseDropdown,
-                  });
-                  item.onClick();
-                }}
-              >
-                {item.content}
-              </button>
-            </li>
-          );
-        })}
-      </ul>
-    </div>
-  );
-};
-
-/*------------------------------------------------------------------------*/
-/* ------------------------------- Wrap Up ------------------------------ */
-/*------------------------------------------------------------------------*/
-
-// Export component
-export default Dropdown;

package/src/helpers/validators/ChicagoTitleCase.test.ts

@@ -1,85 +0,0 @@
-// Importing the testing function
-// import chicagoTitleCase from './chicagoTitleCase';
-
-// // Import constants
-// import { INVALID_STRING_ERRORS, INVALID_REGEX_ERROR } from './shared/constants/ERROR_MESSAGES';
-
-// /*------------------------------------------------------------------------*/
-// /* ---------------------------- Valid Tests --------------------------- */
-// /*------------------------------------------------------------------------*/
-
-// const validTests: { input: string, expected: string }[] = [
-//   {
-//     input: 'this is the american language',
-//     expected: 'This the American language',
-//   },
-//   {
-//     input: 'to kill a mockingbird',
-//     expected: 'To Kill a Mockingbird',
-//   },
-//   {
-//     input: 'the lord of the rings',
-//     expected: 'The Lord of the Rings',
-//   },
-//   {
-//     input: 'pride and prejudice',
-//     expected: 'Pride and Prejudice',
-//   },
-//   {
-//     input: 'the road not taken',
-//     expected: 'The Road Not Taken',
-//   },
-// ];
-
-// test(
-//   'Converts strings to Chicago title case correctly.',
-//   async () => {
-//     validTests.forEach(({ input, expected }) => {
-//       expect(chicagoTitleCase(input)).toBe(expected);
-//     });
-//   },
-// );
-
-// /*------------------------------------------------------------------------*/
-// /* ---------------------------- Edge Cases ---------------------------- */
-// /*------------------------------------------------------------------------*/
-
-// const edgeCases: { input: string, expected: string }[] = [
-//   {
-//     input: 'x',
-//     expected: 'X',
-//   },
-//   {
-//     input: ' ',
-//     expected: ' ',
-//   },
-//   {
-//     input: '',
-//     expected: '',
-//   },
-//   {
-//     input: 'the',
-//     expected: 'The',
-//   },
-//   {
-//     input: 'THE ROAD NOT TAKEN',
-//     expected: 'The Road Not Taken',
-//   },
-//   {
-//     input: 'tO kiLL A mOckingBirD',
-//     expected: 'To Kill a Mockingbird',
-//   },
-//   {
-//     input: 'pRiDe And pReduJiCe',
-//     expected: 'Pride and Prejudice',
-//   },
-// ];
-
-// test(
-//   'Handles the edge cases for the function that converts a string to Chicago Title Case.',
-//   async () => {
-//     edgeCases.forEach(({ input, expected }) => {
-//       expect(chicagoTitleCase(input)).toBe(expected);
-//     });
-//   },
-// );

package/src/helpers/validators/ChicagoTitleCase.ts

@@ -1,32 +0,0 @@
-/**
- * This function converts a string to title case based on Chicago Title Case 
- * Style rules.
- * @author Leisha Bhandari
- * @param input: The input string that needs to be converted to Chicago title
- *               case.
- * @returns Input string converted to title case
- */
-
-
-const chicagoTitleCase = (input: string): string => {
-   // List of lowercase words according to Chicago Manual of Style
-  const lowerCaseWords: string[] = [
-    'in', 'nor', 'of', 'on', 'or', 'as', 'at', 'but', 'by',
-    'for', 'if', 'so', 'the', 'a', 'an', 'and', 'to', 'up',
-    'yet'
-  ];
-
-  return input
-    // Converts given input string to lowercase
-    .toLowerCase() 
-    // Splits the given string into separate words
-    .split(' ') 
-    .map((word, index, words) => 
-      // Capitalize the first word, last word, and the words that aren't
-      // in lowerCaseWords
-      index === 0 || !lowerCaseWords.includes(word) || index === words.length - 1
-        ? `${word.charAt(0).toUpperCase()}${word.slice(1)}` // Capitalize the first letter
-        : word // Nothing happens to the word
-    )
-    .join(' '); // Joins the words back 
-};