@appquality/unguess-design-system 2.6.2 → 2.8.0

package/build/stories/campaignCards/_types.d.ts

@@ -12,11 +12,11 @@ export interface CampaignCardsProps extends CardProps {
     /**
      * the main topic of the card
      */
-    title: string;
+    projectTitle: string;
     /**
      * a specification to the topic of the card
      */
-    subTitle: string;
+    campaignTitle: string;
     /**
      * the status of the card,
      * can be only
@@ -36,4 +36,8 @@ export interface CampaignCardsProps extends CardProps {
      * if the value is not defined the pill text will not be shown
      */
     pillText?: string;
+    /**
+     * this renders the new flag label
+     */
+    labelNew?: string;
 }

package/build/stories/dropdowns/menu/_types.d.ts

@@ -1,4 +1,4 @@
-import { IMenuProps } from "@zendeskgarden/react-dropdowns";
+import { IItemProps, IMenuProps } from "@zendeskgarden/react-dropdowns";
 export interface MenuArgs extends IMenuProps {
     /**
      * Allows the menu to reposition during browser resize events
@@ -29,3 +29,19 @@ export interface MenuArgs extends IMenuProps {
      */
     maxHeight?: string;
 }
+export interface PreviousItemArgs extends IItemProps {
+    /** Sets the value that is returned upon selection */
+    value?: any;
+    /** Indicates that the element is not interactive */
+    disabled?: boolean;
+    /** Applies danger styling */
+    isDanger?: boolean;
+}
+export interface NextItemArgs extends IItemProps {
+    /** Sets the value that is returned upon selection */
+    value?: any;
+    /** Indicates that the element is not interactive */
+    disabled?: boolean;
+    /** Applies danger styling */
+    isDanger?: boolean;
+}

package/build/stories/dropdowns/menu/index.d.ts

@@ -1,7 +1,14 @@
-/// <reference types="react" />
-import { MenuArgs } from "./_types";
+import { MenuArgs, NextItemArgs, PreviousItemArgs } from "./_types";
+import { HTMLAttributes, LiHTMLAttributes } from "react";
 /**
    * A Menu is a wrapper for items elements
    **/
 declare const Menu: (props: MenuArgs) => JSX.Element;
-export { Menu };
+declare const PreviousItem: (props: PreviousItemArgs) => JSX.Element;
+declare const Separator: (props: LiHTMLAttributes<HTMLLIElement>) => JSX.Element;
+declare const NextItem: (props: NextItemArgs) => JSX.Element;
+declare const ItemMeta: (props: HTMLAttributes<HTMLSpanElement>) => JSX.Element;
+declare const MediaBody: (props: HTMLAttributes<HTMLDivElement>) => JSX.Element;
+declare const MediaFigure: (props: HTMLAttributes<Element>) => JSX.Element;
+declare const MediaItem: (props: LiHTMLAttributes<HTMLLIElement>) => JSX.Element;
+export { Menu, PreviousItem, Separator, NextItem, ItemMeta, MediaBody, MediaFigure, MediaItem };

package/build/stories/dropdowns/menu/index.stories.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { ComponentMeta, Story } from '@storybook/react';
+export declare const Default: Story<any>;
+export declare const Nested: Story<any>;
+declare const _default: ComponentMeta<(props: import("./_types").MenuArgs) => JSX.Element>;
+export default _default;

package/build/stories/navigation/app-header/_types.d.ts

@@ -9,9 +9,9 @@ export interface AppHeaderArgs extends HeaderArgs {
     /** Set Brand Item settings */
     brand?: BrandItemArgs;
     /** Set Avatar settings */
-    avatar?: AvatarArgs & {
-        onProfileModalToggle?: () => void;
-    };
+    avatar?: AvatarArgs;
+    isProfileModalOpen?: boolean;
+    onProfileModalToggle?: () => void;
     /** Toggle Sidebar */
     onSidebarMenuToggle?: () => void;
 }

package/build/stories/profile-modal/UserContainer.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { UserProfileProps } from "./_types";
+export declare const UserContainer: (props: UserProfileProps) => JSX.Element;

package/build/stories/profile-modal/_types.d.ts

@@ -0,0 +1,41 @@
+import { LiHTMLAttributes } from "react";
+import { NextItemArgs } from "../dropdowns/menu/_types";
+import { ModalArgs } from "../modals/_types";
+export interface ProfileModalArgs extends ModalArgs {
+    menuArgs: UserMenuArgs;
+}
+export interface MenuItemProps extends NextItemArgs {
+    selectedItem?: string;
+    icon?: React.ReactNode;
+    content?: any;
+    setActive: (item: string) => void;
+}
+export interface Language {
+    key: string;
+    label: string;
+}
+export interface UserProfileProps {
+    name: string;
+    email: string;
+    picture?: string;
+    company?: string;
+}
+export interface UserMenuArgs extends LiHTMLAttributes<HTMLLIElement> {
+    user: UserProfileProps;
+    csm: UserProfileProps;
+    feedbackTitle?: string;
+    feedbackSubTitle?: string;
+    csmTitle?: string;
+    csmContactLabel?: string;
+    languageTitle?: string;
+    currentLanguageLabel?: string;
+    languages: {
+        [key: string]: Language;
+    };
+    currentLanguage: string;
+    logoutTitle?: string;
+    onSelectLanguage: (lang: string) => void;
+    onFeedbackClick: () => void;
+    onToggleChat: () => void;
+    onLogout: () => void;
+}

package/build/stories/profile-modal/helpMenuItem.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="react" />
+import { MenuItemProps } from "./_types";
+interface HelpItemProps extends MenuItemProps {
+    title: string;
+    value: string;
+    contactLabel: string;
+    copyLabel?: string;
+    chatSupportLabel?: string;
+    /** Toggle Chat https://docs.customerly.io/api/is-it-possible-to-open-the-live-chat-directly-from-a-link-or-a-custom-button */
+    toggleChat: () => void;
+    csm: {
+        name: string;
+        email: string;
+        picture?: string;
+    };
+}
+export declare const HelpItem: (props: HelpItemProps) => JSX.Element;
+export {};

package/build/stories/profile-modal/index.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { ProfileModalArgs } from "./_types";
+/**
+ * Profile Modal
+
+ * Used for this:
+    - Show user main infos and actions
+
+ */
+declare const ProfileModal: ({ menuArgs, ...args }: ProfileModalArgs) => JSX.Element;
+export { ProfileModal };

package/build/stories/profile-modal/index.stories.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { ComponentMeta, Story } from "@storybook/react";
+import { ProfileModalArgs } from "./_types";
+export declare const Default: Story<ProfileModalArgs>;
+declare const _default: ComponentMeta<({ menuArgs, ...args }: ProfileModalArgs) => JSX.Element>;
+export default _default;

package/build/stories/profile-modal/languageMenuItem.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { Language, MenuItemProps } from "./_types";
+interface LanguagesProps extends MenuItemProps {
+    title: string;
+    value: string;
+    languages: {
+        [key: string]: Language;
+    };
+    currentLanguage: string;
+    currentLanguageLabel?: string;
+    onSelectLanguage: (lang: string) => void;
+}
+export declare const LanguageItem: (props: LanguagesProps) => JSX.Element;
+export {};

package/build/stories/profile-modal/menuItem.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { MenuItemProps } from "./_types";
+export interface IStyledItemProps {
+    isFocused?: boolean;
+    isCompact?: boolean;
+    isDanger?: boolean;
+    disabled?: boolean;
+    checked?: boolean;
+}
+export declare const MenuItemBody: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const MenuItem: ({ children, selectedItem, content, ...props }: MenuItemProps) => JSX.Element;

package/build/stories/profile-modal/menuItemIcon.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+interface IStyledItemIconProps {
+    isCompact?: boolean;
+    isVisible?: boolean;
+    isDisabled?: boolean;
+}
+export declare const StyledMenuItemIcon: import("styled-components").StyledComponent<"div", any, IStyledItemIconProps, never>;
+export declare const MenuItemIcon: (props: IStyledItemIconProps) => JSX.Element;
+export {};

package/build/stories/profile-modal/previousMenuButton.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { ButtonArgs } from "../buttons/button/_types";
+export declare const PreviousButton: (props: ButtonArgs) => JSX.Element;

package/build/stories/profile-modal/userMenu.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { UserMenuArgs } from "./_types";
+export declare const UserMenu: (props: UserMenuArgs) => JSX.Element;

package/build/stories/profile-modal/utils.d.ts

@@ -0,0 +1 @@
+export declare const getInitials: (name: string) => string;

package/build/stories/table/_types.d.ts

@@ -1,10 +1,20 @@
 import { ITableProps, IRowProps, ICellProps, IHeaderCellProps, ISortableCellProps } from "@zendeskgarden/react-tables";
 import { SIZE, SORT } from "@zendeskgarden/react-tables/dist/typings/styled";
+import { IconArgs } from "../icons/_types";
 export interface TableProps extends ITableProps {
     /** Sets the table size */
     size?: SIZE;
     /** Removes interactive styling from table rows */
     isReadOnly?: boolean;
+    columns?: Array<{
+        name: string;
+        field: string;
+    }>;
+    items?: Array<IRow>;
+    groups?: Array<Group> | null;
+    isStriped?: boolean;
+    hasCaption?: boolean;
+    isTruncated?: boolean;
 }
 export interface HeaderCellArgs extends IHeaderCellProps {
     /** Applies striped styling */
@@ -60,3 +70,14 @@ export interface SortableCellArgs extends ISortableCellProps {
     /** Passes props to the cell */
     cellProps?: any;
 }
+export interface IRow {
+    id?: number | string;
+    groupName?: string;
+    selected?: boolean;
+    [index: string]: any;
+}
+export interface Group {
+    groupName: string;
+    groupIcon: IconArgs["type"];
+    items: Array<IRow>;
+}

package/build/stories/table/grouped.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { RowArgs, TableProps } from "./_types";
+declare const GroupRow: (props: RowArgs) => JSX.Element;
+declare const GroupedTable: ({ columns, groups, ...args }: TableProps) => JSX.Element;
+export { GroupedTable, GroupRow };

package/build/stories/table/index.d.ts

@@ -1,5 +1,5 @@
-import { HTMLAttributes } from 'react';
-import { CellArgs, HeaderCellArgs, RowArgs, SortableCellArgs, TableProps } from './_types';
+import { HTMLAttributes } from "react";
+import { CellArgs, HeaderCellArgs, RowArgs, SortableCellArgs, TableProps } from "./_types";
 /**
  * A Table organizes data into columns and rows. Tables make it easier for users to compare and analyze information.
 
@@ -16,7 +16,6 @@ declare const HeaderCell: (props: HeaderCellArgs) => JSX.Element;
 declare const Body: (props: HTMLAttributes<HTMLTableSectionElement>) => JSX.Element;
 declare const Row: (props: RowArgs) => JSX.Element;
 declare const Cell: (props: CellArgs) => JSX.Element;
-declare const GroupRow: (props: RowArgs) => JSX.Element;
 declare const Caption: (props: HTMLAttributes<HTMLTableCaptionElement>) => JSX.Element;
 declare const SortableCell: (props: SortableCellArgs) => JSX.Element;
-export { Table, Head, HeaderRow, HeaderCell, Body, Row, Cell, GroupRow, Caption, SortableCell, };
+export { Table, Head, HeaderRow, HeaderCell, Body, Row, Cell, Caption, SortableCell };

package/build/stories/table/index.stories.d.ts

@@ -1,40 +1,18 @@
 /// <reference types="react" />
 import { ComponentMeta, Story } from "@storybook/react";
 import { TableProps } from "./_types";
-import { IconArgs } from "../icons/_types";
-interface IRow {
-    id?: number | string;
-    groupName?: string;
-    fruit?: string;
-    sunExposure?: string;
-    soil?: string;
-    selected?: boolean;
-}
-interface Group {
-    groupName: string;
-    groupIcon: IconArgs["type"];
-    items: Array<IRow>;
-}
-interface TableStoryArg extends TableProps {
-    columns: Array<string>;
-    items: Array<IRow>;
-    groups: Array<Group> | null;
-    isStriped?: boolean;
-    hasCaption?: boolean;
-    isTruncated?: boolean;
-}
-export declare const Default: Story<TableStoryArg>;
-export declare const Grouped: Story<TableStoryArg>;
-export declare const WithPagination: Story<TableStoryArg>;
+export declare const Default: Story<TableProps>;
+export declare const Grouped: Story<TableProps>;
+export declare const WithPagination: Story<TableProps>;
 /** STRIPED */
-export declare const Striped: Story<TableStoryArg>;
+export declare const Striped: Story<TableProps>;
 /** WITH CAPTION */
-export declare const WithCaption: Story<TableStoryArg>;
+export declare const WithCaption: Story<TableProps>;
 /** TRUNCATED */
-export declare const Truncated: Story<TableStoryArg>;
-export declare const Scroll: Story<TableStoryArg>;
-export declare const Selection: Story<TableStoryArg>;
-export declare const Sort: Story<TableStoryArg>;
-export declare const VirtualScrolling: Story<TableStoryArg>;
+export declare const Truncated: Story<TableProps>;
+export declare const Scroll: Story<TableProps>;
+export declare const Selection: Story<TableProps>;
+export declare const Sort: Story<TableProps>;
+export declare const VirtualScrolling: Story<TableProps>;
 declare const _default: ComponentMeta<(props: TableProps) => JSX.Element>;
 export default _default;

package/build/stories/theme/mixins.d.ts

@@ -0,0 +1,3 @@
+export declare const flexCenter: import("styled-components").FlattenSimpleInterpolation;
+export declare const flexColumnCenter: import("styled-components").FlattenSimpleInterpolation;
+export declare const flexStart: import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<any>>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appquality/unguess-design-system",
-  "version": "2.6.2",
+  "version": "2.8.0",
   "dependencies": {
     "@zendeskgarden/react-accordions": "^8.49.0",
     "@zendeskgarden/react-avatars": "^8.49.0",