@app-studio/web 0.8.73 → 0.8.74

package/dist/components/Accordion/Accordion/Accordion.props.d.ts

@@ -0,0 +1,91 @@
+import React from 'react';
+import { ViewProps } from 'app-studio';
+import { AccordionStyles, Shape, Variant } from './Accordion.type';
+export interface AccordionProps {
+    /**
+     * The content of the accordion (AccordionItem components)
+     */
+    children: React.ReactNode;
+    /**
+     * Whether multiple items can be expanded at once
+     */
+    allowMultiple?: boolean;
+    /**
+     * Default expanded item IDs
+     */
+    defaultExpandedItems?: string[];
+    /**
+     * The shape of the accordion items
+     */
+    shape?: Shape;
+    /**
+     * The visual style variant of the accordion
+     */
+    variant?: Variant;
+    /**
+     * Custom styles for different parts of the accordion
+     */
+    views?: AccordionStyles;
+}
+export interface AccordionItemProps {
+    /**
+     * Unique identifier for the accordion item
+     */
+    id: string;
+    /**
+     * The content of the accordion item
+     */
+    children: React.ReactNode;
+    /**
+     * Whether the accordion item is disabled
+     */
+    isDisabled?: boolean;
+    /**
+     * Custom styles for this specific accordion item
+     */
+    views?: {
+        item?: ViewProps;
+        header?: ViewProps;
+        content?: ViewProps;
+        icon?: ViewProps;
+    };
+}
+export interface AccordionHeaderProps {
+    /**
+     * The content of the accordion header
+     */
+    children: React.ReactNode;
+    /**
+     * Custom styles for the header
+     */
+    views?: {
+        container?: ViewProps;
+        icon?: ViewProps;
+    };
+}
+export interface AccordionContentProps {
+    /**
+     * The content to be displayed when the accordion item is expanded
+     */
+    children: React.ReactNode;
+    /**
+     * Custom styles for the content
+     */
+    views?: {
+        container?: ViewProps;
+    };
+}
+export interface AccordionType extends React.FC<AccordionProps> {
+    /**
+     * Individual accordion item component
+     */
+    Item: React.FC<AccordionItemProps>;
+    /**
+     * Header component for accordion items
+     */
+    Header: React.FC<AccordionHeaderProps>;
+    /**
+     * Content component for accordion items
+     */
+    Content: React.FC<AccordionContentProps>;
+}

package/dist/components/Accordion/Accordion/Accordion.state.d.ts

@@ -0,0 +1,5 @@
+export declare const useAccordionState: (defaultExpandedItems?: string[], allowMultiple?: boolean) => {
+    expandedItems: string[];
+    toggleItem: (itemId: string) => void;
+    isItemExpanded: (itemId: string) => boolean;
+};

package/dist/components/Accordion/Accordion/Accordion.style.d.ts

@@ -0,0 +1,4 @@
+import { ViewProps } from 'app-studio';
+import { Shape, Variant } from './Accordion.type';
+export declare const AccordionShapes: Record<Shape, ViewProps>;
+export declare const AccordionVariants: Record<Variant, ViewProps>;

package/dist/components/Accordion/Accordion/Accordion.type.d.ts

@@ -0,0 +1,15 @@
+import { ViewProps } from 'app-studio';
+export declare type Shape = 'sharp' | 'rounded';
+export declare type Variant = 'default' | 'outline' | 'filled';
+export interface AccordionContextType {
+    expandedItems: string[];
+    toggleItem: (itemId: string) => void;
+    isItemExpanded: (itemId: string) => boolean;
+}
+export interface AccordionStyles {
+    container?: ViewProps;
+    item?: ViewProps;
+    header?: ViewProps;
+    content?: ViewProps;
+    icon?: ViewProps;
+}

package/dist/components/Accordion/Accordion/Accordion.view.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import { AccordionContextType } from './Accordion.type';
+import { AccordionHeaderProps, AccordionContentProps, AccordionItemProps } from './Accordion.props';
+export declare const AccordionProvider: React.FC<{
+    children: React.ReactNode;
+    value: AccordionContextType;
+}>;
+export declare const useAccordionContext: () => AccordionContextType;
+export declare const AccordionItem: React.FC<AccordionItemProps>;
+export declare const AccordionHeader: React.FC<AccordionHeaderProps & {
+    id?: string;
+    isExpanded?: boolean;
+}>;
+export declare const AccordionContent: React.FC<AccordionContentProps & {
+    isExpanded?: boolean;
+}>;
+export declare const AccordionView: React.FC<{
+    children: React.ReactNode;
+    shape?: 'sharp' | 'rounded';
+    variant?: 'default' | 'outline' | 'filled';
+    views?: any;
+}>;

package/dist/components/Accordion/Accordion.d.ts

@@ -0,0 +1,2 @@
+import { AccordionType } from './Accordion/Accordion.props';
+export declare const Accordion: AccordionType;

package/dist/components/Accordion/examples/default.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const DefaultAccordion: () => React.JSX.Element;

package/dist/components/Accordion/examples/disabled.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const DisabledAccordion: () => React.JSX.Element;

package/dist/components/Accordion/examples/index.d.ts

@@ -0,0 +1,4 @@
+export * from './default';
+export * from './variants';
+export * from './multiple';
+export * from './disabled';

package/dist/components/Accordion/examples/multiple.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const MultipleAccordion: () => React.JSX.Element;

package/dist/components/Accordion/examples/variants.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const AccordionVariants: () => React.JSX.Element;

package/dist/components/ContextMenu/ContextMenu/ContextMenu.props.d.ts

@@ -0,0 +1,120 @@
+import React from 'react';
+import { ViewProps } from 'app-studio';
+import { ContextMenuItem, ContextMenuStyles, Size, Variant, Position, Alignment } from './ContextMenu.type';
+export interface ContextMenuProps {
+    /**
+     * The content that will trigger the context menu on right-click
+     */
+    children: React.ReactNode;
+    /**
+     * The items to display in the context menu
+     */
+    items: ContextMenuItem[];
+    /**
+     * The size of the context menu items
+     */
+    size?: Size;
+    /**
+     * The visual style variant of the context menu
+     */
+    variant?: Variant;
+    /**
+     * Whether to disable the default browser context menu
+     */
+    disableNativeContextMenu?: boolean;
+    /**
+     * Custom styles for different parts of the context menu
+     */
+    views?: ContextMenuStyles;
+    /**
+     * Additional props to be spread to the container element
+     */
+    [key: string]: any;
+}
+export interface ContextMenuTriggerProps {
+    /**
+     * The content that will trigger the context menu on right-click
+     */
+    children: React.ReactNode;
+    /**
+     * Whether to disable the default browser context menu
+     */
+    disableNativeContextMenu?: boolean;
+    /**
+     * Custom styles for the trigger container
+     */
+    views?: {
+        container?: ViewProps;
+    };
+}
+export interface ContextMenuContentProps {
+    /**
+     * The items to display in the context menu
+     */
+    items: ContextMenuItem[];
+    /**
+     * The position of the context menu
+     */
+    position?: {
+        x: number;
+        y: number;
+    };
+    /**
+     * The preferred side to display the context menu
+     */
+    side?: Position;
+    /**
+     * The alignment of the context menu
+     */
+    align?: Alignment;
+    /**
+     * Custom styles for the context menu
+     */
+    views?: {
+        menu?: ViewProps;
+        item?: ViewProps;
+        divider?: ViewProps;
+        icon?: ViewProps;
+        submenuIndicator?: ViewProps;
+    };
+}
+export interface ContextMenuItemProps {
+    /**
+     * The item data
+     */
+    item: ContextMenuItem;
+    /**
+     * Custom styles for the item
+     */
+    views?: {
+        item?: ViewProps;
+        icon?: ViewProps;
+        submenuIndicator?: ViewProps;
+    };
+}
+export interface ContextMenuDividerProps {
+    /**
+     * Custom styles for the divider
+     */
+    views?: {
+        divider?: ViewProps;
+    };
+}
+export interface ContextMenuType extends React.FC<ContextMenuProps> {
+    /**
+     * The trigger component for the context menu
+     */
+    Trigger: React.FC<ContextMenuTriggerProps>;
+    /**
+     * The content component for the context menu
+     */
+    Content: React.FC<ContextMenuContentProps>;
+    /**
+     * The item component for the context menu
+     */
+    Item: React.FC<ContextMenuItemProps>;
+    /**
+     * The divider component for the context menu
+     */
+    Divider: React.FC<ContextMenuDividerProps>;
+}

package/dist/components/ContextMenu/ContextMenu/ContextMenu.state.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+export declare const useContextMenuState: () => {
+    isOpen: boolean;
+    setIsOpen: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    position: {
+        x: number;
+        y: number;
+    };
+    setPosition: import("react").Dispatch<import("react").SetStateAction<{
+        x: number;
+        y: number;
+    }>>;
+    activeSubmenuId: string | null;
+    setActiveSubmenuId: import("react").Dispatch<import("react").SetStateAction<string | null>>;
+};

package/dist/components/ContextMenu/ContextMenu/ContextMenu.style.d.ts

@@ -0,0 +1,20 @@
+import { ViewProps } from 'app-studio';
+import { Size, Variant, Position, Alignment } from './ContextMenu.type';
+export declare const ContextMenuSizes: Record<Size, ViewProps>;
+export declare const ContextMenuVariants: Record<Variant, ViewProps>;
+export declare const ContextMenuItemStates: {
+    hover: {
+        backgroundColor: string;
+    };
+    active: {
+        backgroundColor: string;
+    };
+    disabled: {
+        opacity: number;
+        cursor: string;
+    };
+};
+export declare const calculateMenuPosition: (x: number, y: number, menuWidth: number, menuHeight: number, windowWidth: number, windowHeight: number, side?: Position, align?: Alignment) => {
+    x: number;
+    y: number;
+};

package/dist/components/ContextMenu/ContextMenu/ContextMenu.type.d.ts

@@ -0,0 +1,41 @@
+import { ViewProps } from 'app-studio';
+import React from 'react';
+export declare type Size = 'sm' | 'md' | 'lg';
+export declare type Variant = 'default' | 'filled' | 'outline';
+export declare type Position = 'top' | 'right' | 'bottom' | 'left';
+export declare type Alignment = 'start' | 'center' | 'end';
+export interface ContextMenuItem {
+    id: string;
+    label: string;
+    icon?: React.ReactNode;
+    onClick?: () => void;
+    disabled?: boolean;
+    items?: ContextMenuItem[];
+    divider?: boolean;
+}
+export interface ContextMenuContextType {
+    isOpen: boolean;
+    setIsOpen: (isOpen: boolean) => void;
+    position: {
+        x: number;
+        y: number;
+    };
+    setPosition: (position: {
+        x: number;
+        y: number;
+    }) => void;
+    activeSubmenuId: string | null;
+    setActiveSubmenuId: (id: string | null) => void;
+    size: Size;
+    variant: Variant;
+}
+export interface ContextMenuStyles {
+    container?: ViewProps;
+    menu?: ViewProps;
+    item?: ViewProps;
+    activeItem?: ViewProps;
+    divider?: ViewProps;
+    icon?: ViewProps;
+    submenuIndicator?: ViewProps;
+    submenu?: ViewProps;
+}

package/dist/components/ContextMenu/ContextMenu/ContextMenu.view.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import { ContextMenuContextType, Size, Variant, ContextMenuItem as ContextMenuItemType } from './ContextMenu.type';
+import { ContextMenuTriggerProps, ContextMenuContentProps, ContextMenuItemProps, ContextMenuDividerProps } from './ContextMenu.props';
+export declare const ContextMenuProvider: React.FC<{
+    children: React.ReactNode;
+    value: ContextMenuContextType;
+}>;
+export declare const useContextMenuContext: () => ContextMenuContextType;
+export declare const ContextMenuTrigger: React.FC<ContextMenuTriggerProps>;
+export declare const ContextMenuContent: React.FC<ContextMenuContentProps>;
+export declare const ContextMenuItem: React.FC<ContextMenuItemProps>;
+export declare const ContextMenuDivider: React.FC<ContextMenuDividerProps>;
+export declare const ContextMenuView: React.FC<{
+    children: React.ReactNode;
+    items: ContextMenuItemType[];
+    size: Size;
+    variant: Variant;
+    disableNativeContextMenu?: boolean;
+    views?: any;
+}>;

package/dist/components/ContextMenu/ContextMenu.d.ts

@@ -0,0 +1,2 @@
+import { ContextMenuType } from './ContextMenu/ContextMenu.props';
+export declare const ContextMenu: ContextMenuType;

package/dist/components/ContextMenu/examples/custom.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const CustomContextMenu: () => React.JSX.Element;

package/dist/components/ContextMenu/examples/default.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const DefaultContextMenu: () => React.JSX.Element;

package/dist/components/ContextMenu/examples/index.d.ts

@@ -0,0 +1,4 @@
+export * from './default';
+export * from './variants';
+export * from './sizes';
+export * from './custom';

package/dist/components/ContextMenu/examples/sizes.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const ContextMenuSizes: () => React.JSX.Element;

package/dist/components/ContextMenu/examples/variants.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const ContextMenuVariants: () => React.JSX.Element;

package/dist/components/DropdownMenu/DropdownMenu/DropdownMenu.props.d.ts

@@ -0,0 +1,117 @@
+import React from 'react';
+import { ViewProps } from 'app-studio';
+import { DropdownMenuItem, DropdownMenuStyles, Size, Variant, Position, Alignment } from './DropdownMenu.type';
+export interface DropdownMenuProps {
+    /**
+     * The trigger element that will open the dropdown menu when clicked
+     */
+    trigger: React.ReactNode;
+    /**
+     * The items to display in the dropdown menu
+     */
+    items: DropdownMenuItem[];
+    /**
+     * The size of the dropdown menu items
+     */
+    size?: Size;
+    /**
+     * The visual style variant of the dropdown menu
+     */
+    variant?: Variant;
+    /**
+     * The preferred side to display the dropdown menu
+     */
+    side?: Position;
+    /**
+     * The alignment of the dropdown menu
+     */
+    align?: Alignment;
+    /**
+     * Whether the dropdown menu is initially open
+     */
+    defaultOpen?: boolean;
+    /**
+     * Custom styles for different parts of the dropdown menu
+     */
+    views?: DropdownMenuStyles;
+    /**
+     * Additional props to be spread to the container element
+     */
+    [key: string]: any;
+}
+export interface DropdownMenuTriggerProps {
+    /**
+     * The content that will trigger the dropdown menu on click
+     */
+    children: React.ReactNode;
+    /**
+     * Custom styles for the trigger container
+     */
+    views?: {
+        container?: ViewProps;
+    };
+}
+export interface DropdownMenuContentProps {
+    /**
+     * The items to display in the dropdown menu
+     */
+    items: DropdownMenuItem[];
+    /**
+     * The preferred side to display the dropdown menu
+     */
+    side?: Position;
+    /**
+     * The alignment of the dropdown menu
+     */
+    align?: Alignment;
+    /**
+     * Custom styles for the dropdown menu
+     */
+    views?: {
+        menu?: ViewProps;
+        item?: ViewProps;
+        divider?: ViewProps;
+        icon?: ViewProps;
+        submenuIndicator?: ViewProps;
+    };
+}
+export interface DropdownMenuItemProps {
+    /**
+     * The item data
+     */
+    item: DropdownMenuItem;
+    /**
+     * Custom styles for the item
+     */
+    views?: {
+        item?: ViewProps;
+        icon?: ViewProps;
+        submenuIndicator?: ViewProps;
+    };
+}
+export interface DropdownMenuDividerProps {
+    /**
+     * Custom styles for the divider
+     */
+    views?: {
+        divider?: ViewProps;
+    };
+}
+export interface DropdownMenuType extends React.FC<DropdownMenuProps> {
+    /**
+     * The trigger component for the dropdown menu
+     */
+    Trigger: React.FC<DropdownMenuTriggerProps>;
+    /**
+     * The content component for the dropdown menu
+     */
+    Content: React.FC<DropdownMenuContentProps>;
+    /**
+     * The item component for the dropdown menu
+     */
+    Item: React.FC<DropdownMenuItemProps>;
+    /**
+     * The divider component for the dropdown menu
+     */
+    Divider: React.FC<DropdownMenuDividerProps>;
+}

package/dist/components/DropdownMenu/DropdownMenu/DropdownMenu.state.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export declare const useDropdownMenuState: (defaultOpen?: boolean) => {
+    isOpen: boolean;
+    setIsOpen: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    activeSubmenuId: string | null;
+    setActiveSubmenuId: import("react").Dispatch<import("react").SetStateAction<string | null>>;
+};

package/dist/components/DropdownMenu/DropdownMenu/DropdownMenu.style.d.ts

@@ -0,0 +1,17 @@
+import { ViewProps } from 'app-studio';
+import { Size, Variant, Position, Alignment } from './DropdownMenu.type';
+export declare const DropdownMenuSizes: Record<Size, ViewProps>;
+export declare const DropdownMenuVariants: Record<Variant, ViewProps>;
+export declare const DropdownMenuItemStates: {
+    hover: {
+        backgroundColor: string;
+    };
+    active: {
+        backgroundColor: string;
+    };
+    disabled: {
+        opacity: number;
+        cursor: string;
+    };
+};
+export declare const getDropdownPosition: (side?: Position, align?: Alignment) => ViewProps;

package/dist/components/DropdownMenu/DropdownMenu/DropdownMenu.type.d.ts

@@ -0,0 +1,34 @@
+import { ViewProps } from 'app-studio';
+import React from 'react';
+export declare type Size = 'sm' | 'md' | 'lg';
+export declare type Variant = 'default' | 'filled' | 'outline';
+export declare type Position = 'top' | 'right' | 'bottom' | 'left';
+export declare type Alignment = 'start' | 'center' | 'end';
+export interface DropdownMenuItem {
+    id: string;
+    label: string;
+    icon?: React.ReactNode;
+    onClick?: () => void;
+    disabled?: boolean;
+    items?: DropdownMenuItem[];
+    divider?: boolean;
+}
+export interface DropdownMenuContextType {
+    isOpen: boolean;
+    setIsOpen: (isOpen: boolean) => void;
+    activeSubmenuId: string | null;
+    setActiveSubmenuId: (id: string | null) => void;
+    size: Size;
+    variant: Variant;
+}
+export interface DropdownMenuStyles {
+    container?: ViewProps;
+    trigger?: ViewProps;
+    menu?: ViewProps;
+    item?: ViewProps;
+    activeItem?: ViewProps;
+    divider?: ViewProps;
+    icon?: ViewProps;
+    submenuIndicator?: ViewProps;
+    submenu?: ViewProps;
+}

package/dist/components/DropdownMenu/DropdownMenu/DropdownMenu.view.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { DropdownMenuContextType, DropdownMenuItem as DropdownMenuItemType, Position, Alignment } from './DropdownMenu.type';
+import { DropdownMenuTriggerProps, DropdownMenuContentProps, DropdownMenuItemProps, DropdownMenuDividerProps } from './DropdownMenu.props';
+export declare const DropdownMenuProvider: React.FC<{
+    children: React.ReactNode;
+    value: DropdownMenuContextType;
+}>;
+export declare const useDropdownMenuContext: () => DropdownMenuContextType;
+export declare const DropdownMenuTrigger: React.FC<DropdownMenuTriggerProps>;
+export declare const DropdownMenuContent: React.FC<DropdownMenuContentProps>;
+export declare const DropdownMenuItem: React.FC<DropdownMenuItemProps>;
+export declare const DropdownMenuDivider: React.FC<DropdownMenuDividerProps>;
+export declare const DropdownMenuView: React.FC<{
+    trigger: React.ReactNode;
+    items: DropdownMenuItemType[];
+    side?: Position;
+    align?: Alignment;
+    views?: any;
+}>;

package/dist/components/DropdownMenu/DropdownMenu.d.ts

@@ -0,0 +1,2 @@
+import { DropdownMenuType } from './DropdownMenu/DropdownMenu.props';
+export declare const DropdownMenu: DropdownMenuType;

package/dist/components/DropdownMenu/examples/custom.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const CustomDropdownMenu: () => React.JSX.Element;

package/dist/components/DropdownMenu/examples/default.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const DefaultDropdownMenu: () => React.JSX.Element;

package/dist/components/DropdownMenu/examples/index.d.ts

@@ -0,0 +1,5 @@
+export * from './default';
+export * from './positions';
+export * from './variants';
+export * from './sizes';
+export * from './custom';

package/dist/components/DropdownMenu/examples/positions.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const DropdownMenuPositions: () => React.JSX.Element;

package/dist/components/DropdownMenu/examples/sizes.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const DropdownMenuSizes: () => React.JSX.Element;

package/dist/components/DropdownMenu/examples/variants.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const DropdownMenuVariants: () => React.JSX.Element;

package/dist/components/Formik/Formik.Slider.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { SliderProps } from '../Slider/Slider/Slider.props';
+/**
+ * Slider component integrated with Formik for form state management.
+ * Allows users to select a value from a range by moving a handle.
+ */
+export declare const FormikSlider: React.FC<SliderProps>;

package/dist/components/Formik/examples/FormikSlider.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const FormikSliderExample: () => React.JSX.Element;