@simoncomputing/mui-bueno-v3 0.1.13 → 0.1.15

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@simoncomputing/mui-bueno-v3",
     "private": false,
-    "version": "0.1.13",
+    "version": "0.1.15",
     "type": "module",
     "main": "./dist/index.umd.js",
     "module": "./dist/index.es.js",
@@ -43,11 +43,10 @@
         "@mui/material": "^6.4.9",
         "@mui/x-date-pickers": "^7.23.3",
         "dayjs": "^1.11.13",
-        "formik": "^2.4.6",
         "react": "^19.0.0",
         "react-dom": "^19.0.0",
-        "react-router-dom": "^7.1.1",
-        "react-hook-form": "^7.59.0"
+        "react-hook-form": "^7.59.0",
+        "react-router-dom": "^7.1.1"
     },
     "dependencies": {
         "@hookform/resolvers": "^5.1.1",
@@ -102,12 +101,12 @@
     },
     "devDependencies": {
         "@chromatic-com/storybook": "^3.2.3",
-        "@storybook/addon-essentials": "^8.4.7",
-        "@storybook/addon-interactions": "^8.4.7",
-        "@storybook/addon-links": "^8.4.7",
-        "@storybook/addon-themes": "^8.4.7",
-        "@storybook/react": "^8.4.7",
-        "@storybook/react-vite": "^8.4.7",
+        "@storybook/addon-essentials": "^8.6.15",
+        "@storybook/addon-interactions": "^8.6.15",
+        "@storybook/addon-links": "^8.6.15",
+        "@storybook/addon-themes": "^8.6.15",
+        "@storybook/react": "^8.6.15",
+        "@storybook/react-vite": "^8.6.15",
         "@testing-library/jest-dom": "^6.6.3",
         "@testing-library/react": "^16.1.0",
         "@testing-library/user-event": "^14.5.2",

package/dist/components/Form/Inputs/CitationField/CitationBubbleMenuHandler.d.ts

@@ -1,43 +0,0 @@
-import { Extension } from '@tiptap/core';
-import { CitationBubbleMenuProps } from './CitationMenu/CitationBubbleMenu';
-declare module '@tiptap/core' {
-    interface Commands<ReturnType> {
-        citation: {
-            /**
-             * Open/show the link bubble menu. Create a link if one doesn't exist at
-             * the current cursor selection, or edit the existing link if there is
-             * already a link at the current selection.
-             *
-             * If the options are provided, they're used to override the bubble menu
-             * props, which can be useful for specific positioning needs. Each call to
-             * `openLinkBubbleMenu` will reset the options based on the provided
-             * argument, falling back to default behavior if not provided.
-             *
-             * For instance, if the anchorEl option is provided, it overrides the
-             * anchor point for positioning the bubble menu. (The default anchorEl for
-             * LinkBubbleMenu is to anchor to the location in the editor content where
-             * the link appears or will appear.)
-             */
-            openCitationBubbleMenu: (options?: Partial<CitationBubbleMenuProps>, selectedNodePos?: number) => ReturnType;
-            /** Close/hide the link bubble menu, canceling any ongoing edits. */
-            closeCitationBubbleMenu: () => ReturnType;
-        };
-    }
-}
-export type CitationBubbleMenuHandlerStorage = {
-    isOpen: boolean;
-    selectedIds: number[];
-    bubbleMenuOptions: Partial<CitationBubbleMenuProps> | undefined;
-    selectedNodePos: number | undefined;
-};
-/**
- * To be used in conjunction with the `CitationBubbleMenuTipTap` component, as this
- * extension provides editor commands to control the state of the link bubble
- * menu.
- *
- * The Tiptap Link extension (@tiptap/extension-link) should also be installed
- * and included in your extensions when using CitationBubbleMenuHandler:
- * https://tiptap.dev/api/marks/link.
- */
-declare const CitationBubbleMenuHandler: Extension<undefined, CitationBubbleMenuHandlerStorage>;
-export default CitationBubbleMenuHandler;

package/dist/components/Form/Inputs/CitationField/CitationField.d.ts

@@ -1,78 +0,0 @@
-import { TypographyProps } from '@mui/material';
-import { Citation, PageState, PageResponse, UnsavedCitation, UnsavedAttachment } from '../../../../@types';
-export type CitationFieldProps = {
-    /**
-     * Name and ID of the component. Must match a key from initialValues in Formik.
-     * @required
-     */
-    name: string;
-    /**
-     * (Optional) Label. NOTE: this won't be floating, it's always static.
-     */
-    label?: string;
-    /**
-     * Styling for label
-     */
-    labelProps?: TypographyProps;
-    /**
-     * If `true`, the component becomes readonly.
-     * @default false
-     */
-    readOnly?: boolean;
-    /**
-     * Margin for the FormControl
-     */
-    margin?: 'dense' | 'none' | 'normal';
-    renderContentOnly?: never;
-    /**
-     * API call for fetching paginated citations. These will populate the "Insert Citation/Attachment(s)" table.
-     *
-     * If an error occurs during the API call, notify the user then throw the error so that
-     * Mui Bueno can handle updating state.
-     */
-    fetchExistingCitations: (req: PageState) => Promise<PageResponse<Citation>>;
-    /**
-     * API call for creating a new citation/attachment.
-     *
-     * If an error occurs during the API call, notify the user then throw the error so that
-     * Mui Bueno can handle updating state.
-     */
-    onCreateCitation: (citation: UnsavedCitation) => Promise<Citation>;
-    /**
-     * API call for updating a citation/attachment.
-     *
-     * If an error occurs during the API call, notify the user then throw the error so that
-     * Mui Bueno can handle updating state.
-     */
-    onUpdateCitation: (citation: Citation) => Promise<Citation>;
-    /**
-     * API call for retrieving a citation by id
-     *
-     * If an error occurs during the API call, notify the user then throw the error so that
-     * Mui Bueno can handle updating state.
-     */
-    getCitationById: (id: number) => Promise<Citation>;
-    /**
-     * API call for storing an attachment (ex. in an s3 bucket)
-     *
-     * If an error occurs during the API call, notify the user then throw the error so that
-     * Mui Bueno can handle updating state.
-     */
-    onStoreAttachment: (citation: UnsavedAttachment) => Promise<Citation>;
-    /**
-     * API call for retrieving an array citations by an array ids
-     *
-     * If an error occurs during the API call, notify the user then throw the error so that
-     * Mui Bueno can handle updating state.
-     */
-    getCitationsByIds: (ids: number[]) => Promise<Citation[]>;
-};
-/**
- * Rich Text field -- uses MUI Tip Tap
- *
- * Formik -- This field cannot be completely controlled, so keep in mind that the Formik value will not update until the field
- * __loses focus__. This is to prevent issues with converting from rich text to HTML as the user types as it could override
- * their changes unintentionally.
- */
-export declare const CitationField: (props: CitationFieldProps) => import("react/jsx-runtime").JSX.Element;
-export default CitationField;

package/dist/components/Form/Inputs/CitationField/CitationMenu/AttachmentForm.d.ts

@@ -1,13 +0,0 @@
-import { ReactNode } from 'react';
-import { Citation, UnsavedAttachment } from '../../../../../@types';
-export type NewAttachmentFormProps = {
-    id?: number;
-    editMenuTitle: ReactNode;
-    onSave: (citation: UnsavedAttachment) => Promise<void>;
-    onCancel: () => void;
-    getCitationById: (id: number) => Promise<Citation>;
-    disableFileUpload?: boolean;
-    onTitleChanged?: (id: number) => void;
-};
-declare const NewAttachmentForm: (props: NewAttachmentFormProps) => import("react/jsx-runtime").JSX.Element;
-export default NewAttachmentForm;

package/dist/components/Form/Inputs/CitationField/CitationMenu/CitationBubbleMenu.d.ts

@@ -1,25 +0,0 @@
-import { Except } from 'type-fest';
-import { ControlledBubbleMenuProps } from 'mui-tiptap';
-import { CitationMenuProps } from './CitationMenu';
-export type CitationBubbleMenuProps = Partial<Except<ControlledBubbleMenuProps, 'open' | 'editor' | 'children'>> & Omit<CitationMenuProps, 'onSelectCitations' | 'onCancel'>;
-/**
- * TipTap Wrapper for CitationMenu so that it renders as a bubble/pop-up menu integrated
- * with TipTap
- *
- * A component that renders a bubble menu when viewing, creating, or editing a
- * link. Requires the mui-tiptap CitationBubbleMenuHandler extension and Tiptap's
- * Link extension (@tiptap/extension-link, https://tiptap.dev/api/marks/link) to
- * both be included in your editor `extensions` array.
- *
- * Pairs well with the `<MenuButtonEditLink />` component.
- *
- * If you're using `RichTextEditor`, include this component via
- * `RichTextEditor`’s `children` render-prop. Otherwise, include the
- * `LinkBubbleMenu` as a child of the component where you call `useEditor` and
- * render your `RichTextField` or `RichTextContent`. (The bubble menu itself
- * will be positioned appropriately no matter where you put it in your React
- * tree, as long as it is re-rendered whenever the Tiptap `editor` forces an
- * update, which will happen if it's a child of the component using
- * `useEditor`).
- */
-export default function CitationBubbleMenuTipTap({ fetchExistingCitations, onCreateCitation, onUpdateCitation, getCitationById, onStoreAttachment, onTitleChanged, ...controlledBubbleMenuProps }: CitationBubbleMenuProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/Form/Inputs/CitationField/CitationMenu/CitationForm.d.ts

@@ -1,12 +0,0 @@
-import { ReactNode } from 'react';
-import { Citation, UnsavedCitation } from '../../../../../@types';
-export type NewCitationFormProps = {
-    id?: number;
-    editMenuTitle: ReactNode;
-    onSave: (citation: UnsavedCitation) => Promise<void>;
-    onCancel: () => void;
-    getCitationById: (id: number) => Promise<Citation>;
-    onTitleChanged?: (id: number) => void;
-};
-declare const NewCitationForm: (props: NewCitationFormProps) => import("react/jsx-runtime").JSX.Element;
-export default NewCitationForm;

package/dist/components/Form/Inputs/CitationField/CitationMenu/CitationMenu.d.ts

@@ -1,62 +0,0 @@
-import { Citation, PageState, PageResponse, UnsavedCitation, UnsavedAttachment } from '../../../../../@types';
-export interface CitationMenuProps {
-    /**
-     * API call for fetching citations. These will populate the "Insert Citation/Attachment(s)" table.
-     */
-    fetchExistingCitations: (req: PageState) => Promise<PageResponse<Citation>>;
-    /**
-     * API call for creating a new citation/attachment.
-     */
-    onCreateCitation: (citation: UnsavedCitation) => Promise<Citation>;
-    /**
-     * API call for updating a citation/attachment.
-     */
-    onUpdateCitation: (citation: Citation) => Promise<Citation>;
-    /**
-     * API call for retrieving a citation by id
-     */
-    getCitationById: (id: number) => Promise<Citation>;
-    /**
-     * API call for storing an attachment (ex. in an s3 bucket)
-     */
-    onStoreAttachment: (citation: UnsavedAttachment) => Promise<Citation>;
-    /**
-     * Set which citations should be pre-checked in the citations table when this component is first rendered (used
-     * to initialize useState).
-     */
-    initialSelectedIds?: number[];
-    /**
-     * Callback for when the user clicks the "Select" button. This passes an array of selected citations
-     * that the user chose to the parent component.
-     */
-    onSelectCitations: (citationIds: number[]) => void;
-    /**
-     * Callback for when the user clicks the "Cancel" button. If you're using a modal, close your modal here.
-     */
-    onCancel: () => void;
-    /**
-     * Callback whenever the size of the content potentially changes. Use this if you're using something like
-     * a Popper, so that it can reposition itself when the dimensions of its content changes.
-     *
-     * Currently, this will be called when the data in the citations table changes, and when the content itself changes (ex. clicks on "Add Citation")
-     */
-    onContentUpdate?: () => void;
-    /**
-     * Optional callback, used to notify parent that the user has changed their Citation's title.
-     */
-    onTitleChanged?: (id: number) => void;
-}
-export declare enum CitationMenuState {
-    CITATIONS_TABLE = 0,
-    ADD_CITATION = 1,
-    EDIT_CITATION = 2,
-    ADD_ATTACHMENT = 3,
-    EDIT_ATTACHMENT = 4
-}
-/**
- * CitationMenu handles creating, updating, and selecting citations.
- *
- * Intended to be used within a bubble/pop-up/modal/dialog. For in-line citations, see CitationField instead.
- */
-export declare function CitationMenu({ fetchExistingCitations, onCreateCitation, onUpdateCitation, getCitationById, onStoreAttachment, onSelectCitations, onCancel, initialSelectedIds, onContentUpdate, onTitleChanged, }: CitationMenuProps): import("react/jsx-runtime").JSX.Element | null;
-export default CitationMenu;

package/dist/components/Form/Inputs/CitationField/CitationMenu/CitationTable.d.ts

@@ -1,16 +0,0 @@
-import { ReactNode } from 'react';
-import { PageState, PageResponse, Citation } from '../../../../../@types';
-export type CitationTableProps = {
-    editMenuTitle: ReactNode;
-    onCancel: () => void;
-    onNewCitation: () => void;
-    onNewAttachment: () => void;
-    onEditCitation: (citation: Citation) => void;
-    onEditAttachment: (citation: Citation) => void;
-    onSelect: (selectedIds: number[]) => void;
-    fetchExistingCitations: (req: PageState) => Promise<PageResponse<Citation>>;
-    selectedIds: number[];
-    toggleCheckbox: (citation: Citation) => void;
-};
-declare const CitationTable: (props: CitationTableProps) => import("react/jsx-runtime").JSX.Element;
-export default CitationTable;

package/dist/components/Form/Inputs/CitationField/CitationNode.d.ts

@@ -1,2 +0,0 @@
-import { Node } from '@tiptap/core';
-export declare const CitationNode: Node<any, any>;

package/dist/components/Form/Inputs/CitationField/CitationNodeComponent.d.ts

@@ -1,7 +0,0 @@
-import { default as React } from 'react';
-import { NodeViewProps } from '@tiptap/react';
-/**
- * Handles API fetch for CitationNode in order to dynamically load the title, based on a citation's id
- */
-declare const CitationNodeComponent: React.FC<NodeViewProps>;
-export default CitationNodeComponent;

package/dist/components/Form/Inputs/CitationField/CitationRefreshContext/CitationRefreshContext.d.ts

@@ -1,29 +0,0 @@
-import { Citation } from '../../../../../@types';
-type CitationRefreshProviderProps = {
-    /**
-     * CitationField(s)
-     */
-    children: React.ReactNode;
-    /**
-     *  array of unqiue ids of citations currently being referenced in the editor
-     */
-    citationIds: number[];
-    /**
-     * API call for fetching citations. Triggered internally when citationIds changes.
-     */
-    getCitationsByIds: (ids: number[]) => Promise<Citation[]>;
-    /**
-     * Id of the citation that had a title changed. Used internally to determine whether or
-     * not to trigger an API refresh of the citation list.
-     */
-    titleChangedId: number | undefined;
-};
-export declare function CitationRefreshProvider({ children, citationIds, getCitationsByIds, titleChangedId, }: CitationRefreshProviderProps): import("react/jsx-runtime").JSX.Element;
-export declare const useCitationRefreshContext: () => {
-    /**
-     * Array of ALL UNIQUE citations being referenced in the editor.
-     * (Not to be confused with table of citations in the bubble menu -- this is only the citations actually in the editor itself)
-     */
-    citations: Citation[];
-};
-export {};

package/dist/components/Form/Inputs/CitationField/MenuButtonEditCitation.d.ts

@@ -1,3 +0,0 @@
-import { MenuButtonProps } from 'mui-tiptap';
-export type MenuButtonEditCitationProps = Partial<MenuButtonProps>;
-export default function MenuButtonEditCitation(props: MenuButtonEditCitationProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Form/Inputs/Location/Location.d.ts

@@ -1,69 +0,0 @@
-import { TypographyProps } from '@mui/material';
-import { TextFieldProps } from '../TextField/TextField';
-import * as React from 'react';
-type BaseLocationProps = {
-    /**
-     * Name of the component. Must match the initialValue name in Formik.
-     * @required
-     */
-    name: string;
-    /**
-     * API Key. Needed for Location to work.
-     *
-     * NOTE: MAKE SURE TO TIE YOUR API KEY TO A DOMAIN TO ENSURE THE SECURITY OF YOUR KEY
-     * @required
-     */
-    apiKey: string;
-    /**
-     * The label for the text field.
-     * @recommended
-     * @default props.name
-     */
-    label?: string;
-    /**
-     * If true, the parts of the location suggestions that match the input are highlighted
-     * @default true
-     */
-    highlightMatches?: boolean;
-    /**
-     * The icon shown to the left of each location suggestion.
-     * Use false to indicate no icon
-     * @default <LocationOnIcon/>
-     */
-    resultIcon?: React.ReactElement | false;
-    /**
-     * If specified, restrict results from a Place Autocomplete request to be of a certain type.
-     * More information can be found [here](https://developers.google.com/places/supported_types#table3)
-     */
-    types?: 'geocode' | 'address' | 'establishment' | '(regions)' | '(cities)';
-    /**
-     * Specifies the visual input style.
-     * @default 'standard'
-     */
-    variant?: 'filled' | 'outlined' | 'standard';
-    /**
-     * If true, the prepackaged dynamic input label that comes with Material UI's input components
-     * will be replaced with a static typography label above the input.
-     * @default false
-     */
-    staticLabel?: boolean;
-    /**
-     * Props from MUI-Bueno's Typography component.
-     * Used to customize the label when the static label option is selected.
-     */
-    staticLabelProps?: TypographyProps;
-    /**
-     * Margin for the FormControl
-     */
-    margin?: 'dense' | 'none' | 'normal';
-};
-export type LocationProps = BaseLocationProps & TextFieldProps;
-/**
- * The `Location` component provides a Google Maps Places Autocomplete functionality to the Mui Bueno library.
- * It supplies a text field that upon input provides location suggestions.
- *
- * Note: You must have an active Google Maps API key to use this component. More information on creating API keys can be found
- * at the [Google Maps API documentation](https://developers.google.com/maps/documentation/javascript/get-api-key).
- */
-export declare const Location: React.FC<LocationProps>;
-export {};

package/dist/components/Form/Inputs/Location/Location.types.d.ts

@@ -1,85 +0,0 @@
-/**
- * Represents a prediction substring.
- *
- * **Props**
- * - `offset`
- *      - Type: `number`
- *      - The offset to the substring's start within the description string.
- * - `length`
- *      - Type: `number`
- *      - The length of the substring
- *
- * https://developers.google.com/maps/documentation/javascript/reference/places-autocomplete-service#PredictionSubstring
- */
-export type PredictionSubstring = google.maps.places.PredictionSubstring;
-/**
- * Structured information about the place's description, divided into a main text and a secondary text,
- * including an array of matched substrings from the autocomplete input,
- * identified by an offset and a length, expressed in unicode characters.
- *
- * **Props**
- * - `main_text`
- *      - Type: `string`
- *      - This is the main text part of the unformatted description of the place suggested
- *      by the Places service. Usually the name of the place.
- * - `secondary_text`
- *      - Type: `string`
- *      - This is the secondary text part of the unformatted description of the place suggested
- *      by the Places service. Usually the location of the place.
- * - `main_text_matched_substrings`
- *      - Type: `PredictionSubstring[]`
- *      - A set of substrings in the main text that match elements in the user's input, suitable for
- *      use in highlighting those substrings. Each substring is identified by an offset and a length,
- *      expressed in unicode characters.
- *
- * https://developers.google.com/maps/documentation/javascript/reference/places-autocomplete-service#StructuredFormatting
- */
-export type StructuredFormatting = google.maps.places.StructuredFormatting;
-/**
- * Represents a single autocomplete prediction.
- *
- * **Props**
- * - `description`
- *      - Type: `string`
- *      - This is the unformatted version of the query suggested by the Places service.
- * - `structured_formatting`
- *      - Type: `StructuredFormatting`
- *      - Structured information about the place's description
- * - `place_id`
- *      - Type: `string`
- *      - A place ID that can be used to retrieve details about this place using the place details service
- * - `matched_substrings`
- *      - Type: `PredictionSubstring[]`
- *      - A set of substrings in the place's description that match elements in the user's input,
- *      suitable for use in highlighting those substrings. Each substring is identified by an offset
- *      and a length, expressed in unicode characters.
- * - `terms`
- *      - Type: `PredictionTerm`
- *      - Information about individual terms in the above description, from most to least specific.
- *      For example, "Taco Bell", "Willitis", and "CA".
- * - `types`
- *      - Type: `string[]`
- *      - An array of types that the prediction belongs to, for example 'establishment' or 'geocode'.
- *
- * https://developers.google.com/maps/documentation/javascript/reference/places-autocomplete-service#AutocompletePrediction
- */
-export type AutocompletePrediction = google.maps.places.AutocompletePrediction;
-/**
- * Request for fetching AutocompletePredictions
- */
-export interface FetchRequest {
-    /**
-     * Text input from autocomplete field
-     * @required
-     */
-    input: string;
-    /**
-     * Acceptable address types for returning responses
-     * @required
-     */
-    types: string[];
-}
-/**
- * Callback function for fetching AutocompletePredictions
- */
-export type FetchCallback = (results?: AutocompletePrediction[] | null) => void;

package/dist/components/Form/Inputs/Location/LocationOption.d.ts

@@ -1,38 +0,0 @@
-import { AutocompletePrediction } from './Location.types';
-import * as React from 'react';
-interface LocationOptionProps {
-    /**
-     * Props for list item that wraps custom contents
-     * @required
-     */
-    listItemProps: React.HTMLAttributes<HTMLLIElement>;
-    /**
-     * Definition of PlaceType option being rendered in list item
-     * @required
-     */
-    option: AutocompletePrediction;
-    /**
-     * Icon to render on far left of list item
-     * @required
-     */
-    resultIcon: React.ReactElement | false;
-    /**
-     * Indicates to highlight text in option that matches textfield input
-     * @required
-     */
-    highlightMatches: boolean;
-}
-/**
- * Function to render custom location list items in the Autocomplete menu
- *
- * **Required Props**
- * - `listItemProps` - Props for list item that wraps custom contents
- * - `option` - Definition of PlaceType option being rendered in list item
- * - `resultIcon` - Icon to render on far left of list item
- * - `highlightMatches` - Indicates to highlight text in option that matches textfield input
- *
- * @param props LocationOptionProps
- * @returns Custom autocomplete option
- */
-declare const LocationOption: React.FC<LocationOptionProps>;
-export default LocationOption;