cc-ui-library 1.0.3 → 1.0.5

package/lib/StyleGuide/ColorPalette/ColorPalette.d.ts

@@ -0,0 +1,3 @@
+import './ColorPalette.scss';
+declare const Colors: () => import("react/jsx-runtime").JSX.Element;
+export default Colors;

package/lib/StyleGuide/ColorPalette/ColorPalette.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import StyleGuide from './ColorPalette';
+declare const meta: Meta<typeof StyleGuide>;
+type Story = StoryObj<typeof StyleGuide>;
+export declare const ColorList: Story;
+export default meta;

package/lib/StyleGuide/ColorPalette/colorPaletteList.d.ts

@@ -0,0 +1,3 @@
+import { ColorPaletteType } from './types';
+declare const ColorPalette: ColorPaletteType;
+export default ColorPalette;

package/lib/StyleGuide/ColorPalette/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ColorPalette';

package/lib/StyleGuide/ColorPalette/types.d.ts

@@ -0,0 +1,17 @@
+export interface ColorBoxProps {
+    name: string;
+    colorCode: string;
+    opacity?: number;
+    dropShadow?: string;
+    border?: string;
+    variable?: string;
+}
+export interface Color {
+    name: string;
+    colorCode: string;
+    opacity?: number;
+    dropShadow?: string;
+    border?: string;
+    variable?: string;
+}
+export type ColorPaletteType = Color[];

package/lib/StyleGuide/Typography/Typography.d.ts

@@ -0,0 +1,3 @@
+import './Typography.scss';
+declare const Typography: () => import("react/jsx-runtime").JSX.Element;
+export default Typography;

package/lib/StyleGuide/Typography/Typography.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Typography from './Typography';
+declare const meta: Meta<typeof Typography>;
+type Story = StoryObj<typeof Typography>;
+export declare const AllFonts: Story;
+export default meta;

package/lib/StyleGuide/Typography/TypographyList.d.ts

@@ -0,0 +1,5 @@
+export declare const fontData: {
+    name: string;
+    fontSizePx: string;
+    fontSizeRem: string;
+}[];

package/lib/StyleGuide/Typography/types.d.ts

@@ -0,0 +1,8 @@
+export interface FontData {
+    name: string;
+    fontSizePx: string;
+    fontSizeRem: string;
+}
+export interface TypographyProps {
+    fonts: FontData[];
+}

package/lib/assets/utils/functionUtils.d.ts

@@ -1 +1,4 @@
 export declare const isFunction: (functionToCheck: any) => any;
+export declare const convertTo24Hour: (time12h: string) => string;
+export declare const convertTo12Hour: (time24: string) => string;
+export declare const isValid12HourTime: (timeString: string) => boolean;

package/lib/components/Accordion/Accordion.d.ts

@@ -0,0 +1,8 @@
+import './Accordion.scss';
+import '../../../index.scss';
+import { AccordionProps } from './types';
+/**
+ * Accordion UI component
+ */
+declare const Accordion: ({ headerTitle, color, minHeight, accordionContent, disable, disableInfoMessage, }: AccordionProps) => import("react/jsx-runtime").JSX.Element;
+export default Accordion;

package/lib/components/Accordion/Accordion.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Accordion from './Accordion';
+declare const meta: Meta<typeof Accordion>;
+type Story = StoryObj<typeof Accordion>;
+export declare const SampleAccordion: Story;
+export default meta;

package/lib/components/Accordion/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Accordion';

package/lib/components/Accordion/types.d.ts

@@ -0,0 +1,27 @@
+import { ReactNode } from 'react';
+export interface AccordionProps {
+    /**
+     * Accordion Header Title
+     */
+    headerTitle: string | JSX.Element;
+    /**
+     * Content that to be shown while Accordion is expanded
+     */
+    accordionContent: ReactNode;
+    /**
+     * Custom color for the Accordion header
+     */
+    color?: string;
+    /**
+     * Minimum height for the Accordion
+     */
+    minHeight?: string;
+    /**
+     * Property to disable accordion
+     */
+    disable?: boolean;
+    /**
+     * Info message to user for disabling accordion
+     */
+    disableInfoMessage?: string;
+}

package/lib/components/AddResourceButton/AddButton.d.ts

@@ -0,0 +1,4 @@
+import './AddButton.scss';
+import { AddResourceButtonProps } from './type';
+declare const AddButton: ({ id, variant, directionalArrow, zIndex, }: AddResourceButtonProps) => import("react/jsx-runtime").JSX.Element;
+export default AddButton;

package/lib/components/AddResourceButton/AddButton.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta, StoryObj } from '@storybook/react';
+import AddButton from './AddButton';
+declare const meta: Meta<typeof AddButton>;
+type Story = StoryObj<typeof AddButton>;
+export declare const Default: Story;
+export declare const TwoArrowsButtons: Story;
+export declare const ThreeArrowsButton: Story;
+export default meta;

package/lib/components/AddResourceButton/ArrowsButton/ArrowsButton.d.ts

@@ -0,0 +1,6 @@
+import './ArrowsButton.scss';
+import { DirectionalArrowButtonProps } from '../type';
+declare const ArrowsButton: ({ direction, menuOptions, onArrowClick, }: DirectionalArrowButtonProps & {
+    isActive: boolean;
+}) => import("react/jsx-runtime").JSX.Element;
+export default ArrowsButton;

package/lib/components/AddResourceButton/index.d.ts

@@ -0,0 +1 @@
+export { default } from './AddButton';

package/lib/components/AddResourceButton/type.d.ts

@@ -0,0 +1,68 @@
+/**
+ * Describes the directional arrow used in the Add Resource Button component.
+ * The arrow specifies its direction (top, right, down) and associated menu options.
+ *
+ * @property {('top' | 'right' | 'down')} direction - Specifies the direction of the arrow.
+ * @property {(Object | null)[]} menuOptions - The list of menu options displayed when the arrow button is active.
+ * If null, no menu options will be shown.
+ */
+export interface DirectionalArrow {
+    direction: string | 'top' | 'right' | 'down';
+    menuOptions: {
+        label: string;
+        value: string | string[];
+        icon: string;
+        disable?: boolean;
+    }[];
+}
+/**
+ * Props for the Add Resource Button component.
+ *
+ * @property {string} [id] - An optional unique identifier for the Add Resource Button.
+ * @property {('primary' | 'secondary')} [variant] - Optional button style variant.
+ * @property {DirectionalArrow[]} directionalArrow - An array of directional arrows, each specifying the direction and associated menu options. Default values will be provided if not passed.
+ * @property {number} [zIndex] - An optional z-index value for positioning, defaults to 99.
+ */
+export interface AddResourceButtonProps {
+    id?: string;
+    variant?: 'primary' | 'secondary';
+    directionalArrow: {
+        /**
+         * direction option: 'top' | 'right' | 'down'
+         */
+        direction: string | 'top' | 'right' | 'down';
+        menuOptions: {
+            label: string;
+            value: string | string[];
+            icon: string;
+            disable?: boolean;
+        }[];
+    }[];
+    zIndex?: number;
+}
+/**
+ * Props for individual directional arrow buttons.
+ *
+ * @property {('top' | 'right' | 'down')} direction - The direction of the arrow button (top, right, or down).
+ * @property {(Object | any)} menuOptions - The list of menu options or a generic value for dynamic content.
+ * @property {() => void} onArrowClick - Callback function triggered when the arrow button is clicked.
+ * @property {boolean} isActive - Specifies if the button is in an active state (highlighted when selected).
+ */
+export interface DirectionalArrowButtonProps {
+    direction: string | 'top' | 'right' | 'down';
+    menuOptions: {
+        label: string;
+        value: string | string[];
+        icon: string;
+        disable?: boolean;
+    }[];
+    onArrowClick: () => void;
+    isActive: boolean;
+    variant?: 'primary' | 'secondary';
+}
+/**
+ * Utility function to validate an array of directional arrows.
+ * Ensures there is at least one valid arrow in the array.
+ * If the array is empty, it returns a default arrow object.
+ */
+export declare const validateArrows: (arrows: DirectionalArrow[]) => DirectionalArrow[];

package/lib/components/AllProjectsDropdown/AllProjectsDropdown.d.ts

@@ -0,0 +1,3 @@
+import './AllProjectsDropdown.scss';
+declare const AllProjectsDropdown: () => import("react/jsx-runtime").JSX.Element;
+export default AllProjectsDropdown;

package/lib/components/AllProjectsDropdown/AllProjectsDropdown.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import AllProjectsDropdown from './AllProjectsDropdown';
+declare const meta: Meta<typeof AllProjectsDropdown>;
+type Story = StoryObj<typeof AllProjectsDropdown>;
+export declare const PrimaryIconButton: Story;
+export default meta;

package/lib/components/AllProjectsDropdown/index.d.ts

@@ -0,0 +1 @@
+export { default } from './AllProjectsDropdown';

package/lib/components/AppHeader/AppHeader.d.ts

@@ -0,0 +1,4 @@
+import { AppHeaderProps } from './types';
+import './AppHeader.scss';
+declare const AppHeader: React.FC<AppHeaderProps>;
+export default AppHeader;

package/lib/components/AppHeader/AppHeader.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import AppHeader from './AppHeader';
+declare const meta: Meta<typeof AppHeader>;
+type Story = StoryObj<typeof AppHeader>;
+export declare const SampleAppHeader: Story;
+export declare const Controlled: Story;
+export default meta;

package/lib/components/AppHeader/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./AppHeader";

package/lib/components/AppHeader/types.d.ts

@@ -0,0 +1,26 @@
+import { ReactNode } from 'react';
+export interface AppHeaderProps {
+    logoIconName: string;
+    rightContent: ReactNode;
+    projectsList: string[];
+    appHeaderMenuItems: appHeaderMenuItemProps[];
+    appHeaderHiddenMenuItems: string[];
+    selectedMenu: string;
+    selectedSubMenu: string;
+    selectedQuickMenu: string;
+    onMenuClick?: (text: any) => void;
+    onSubMenuClick?: (text: any) => void;
+    onQuickMenuClick?: (text: any) => void;
+}
+export interface appHeaderMenuItemProps {
+    menuName: string;
+    subMenuItems: appHeaderSubMenuItemProps[];
+}
+export interface appHeaderSubMenuItemProps {
+    subMenuName: string;
+    quickMenuItems: appHeaderQuickMenuItemProps[];
+}
+export interface appHeaderQuickMenuItemProps {
+    quickMenuName: string;
+    quickMenuIconName: string;
+}

package/lib/components/Button/Button.d.ts

@@ -1,7 +1,5 @@
 import './Button.scss';
+import '../../assets/styles/_colors.scss';
 import { ButtonProps } from './types';
-/**
- * Primary UI component for user interaction
- */
-declare const Button: ({ variant, backgroundColor, size, onClick, label, disabled, children, type, className, style, transparentBackground, withIcon, iconName, iconPosition, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
+declare const Button: import("react").ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
 export default Button;

package/lib/components/Button/Button.stories.d.ts

@@ -4,7 +4,9 @@ declare const meta: Meta<typeof Button>;
 type Story = StoryObj<typeof Button>;
 export declare const Primary: Story;
 export declare const Secondary: Story;
-export declare const Danger: Story;
-export declare const Success: Story;
-export declare const ButtonWithIcon: Story;
+export declare const Tertiary: Story;
+export declare const Delete: Story;
+export declare const PrimaryWithIcon: Story;
+export declare const SecondaryWithIcon: Story;
+export declare const TertiaryWithIcon: Story;
 export default meta;

package/lib/components/Button/types.d.ts

@@ -3,7 +3,7 @@ export interface ButtonProps {
     /**
      * Variant of the button
      */
-    variant: 'primary' | 'secondary' | 'danger' | 'success';
+    variant: 'primary' | 'secondary' | 'tertiary' | 'delete';
     /**
      * What background color to use
      */
@@ -49,14 +49,6 @@ export interface ButtonProps {
      * Additional styles for the button
      */
     style?: React.CSSProperties;
-    /**
-     * Pass true for transparentBackground button
-     */
-    transparentBackground?: boolean;
-    /**
-     * Pass true if button should be with icon
-     */
-    withIcon?: boolean;
     /**
      * Give icon name availble in storybook that to be on left side of button
      */
@@ -65,4 +57,5 @@ export interface ButtonProps {
      * Give icon name availble in storybook that to be on left side of button
      */
     iconPosition?: 'left' | 'right';
+    transparentBackground?: boolean;
 }

package/lib/components/Charts/DashboardDonutChart/DashboardDonutChart.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { DashboardDonutChartProps } from './types';
+import './DashBoardDonutChart.scss';
+declare const DashboardDonutChart: React.FC<DashboardDonutChartProps>;
+export default DashboardDonutChart;

package/lib/components/Charts/DashboardDonutChart/DashboardDonutChart.stories.d.ts

@@ -0,0 +1,7 @@
+import { Meta, StoryObj } from '@storybook/react/*';
+import DashboardDonutChart from './DashboardDonutChart';
+declare const meta: Meta<typeof DashboardDonutChart>;
+export default meta;
+type Story = StoryObj<typeof DashboardDonutChart>;
+export declare const Default: Story;
+export declare const MemoryLegend: Story;

package/lib/components/Charts/DashboardDonutChart/index.d.ts

@@ -0,0 +1 @@
+export { default } from './DashboardDonutChart';

package/lib/components/Charts/DashboardDonutChart/types.d.ts

@@ -0,0 +1,21 @@
+export type Status = 'passed' | 'failed' | 'warning' | 'skipped' | 'Passed' | 'Failed' | 'Skipped' | 'Warning';
+export type StatusValue = {
+    status: Status;
+    value: number;
+};
+export type ChartItem = {
+    key: string;
+    value: number;
+    color?: string;
+};
+export type LegendType = 'numberLegend' | 'pillLegend' | 'memoryLegend' | 'tableLegend';
+export type DashboardDonutChartProps = {
+    radius: number;
+    lineWidth: number;
+    statusValues: ChartItem[];
+    legendDetailsType: string;
+    isLegendDetails: boolean;
+    gapAngle?: number;
+    legendType: LegendType;
+    showOnlyLabel: boolean;
+};

package/lib/components/Charts/DonutChart/DonutChart.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import './DonutChart.scss';
+import { DonutChartProps } from './type';
+declare const DonutChart: React.FC<DonutChartProps>;
+export default DonutChart;

package/lib/components/Charts/DonutChart/DonutChart.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react/*';
+import DonutChart from './DonutChart';
+declare const meta: Meta<typeof DonutChart>;
+export default meta;
+type Story = StoryObj<typeof DonutChart>;
+export declare const Default: Story;

package/lib/components/Charts/DonutChart/index.d.ts

@@ -0,0 +1 @@
+export { default } from './DonutChart';

package/lib/components/Charts/DonutChart/type.d.ts

@@ -0,0 +1,13 @@
+export type Status = 'passed' | 'failed' | 'warning' | 'skipped' | 'Passed' | 'Failed' | 'Skipped' | 'Warning';
+export type StatusValue = {
+    status: Status;
+    value: number;
+};
+export type DonutChartProps = {
+    radius: number;
+    lineWidth: number;
+    statusValues: StatusValue[];
+    legendDetailsType: string;
+    isLegendDetails: boolean;
+    gapAngle?: number;
+};

package/lib/components/Charts/PieChart/PieChart.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import './PieChart.scss';
+import { PieChartProps } from './types';
+declare const PieChart: React.FC<PieChartProps>;
+export default PieChart;

package/lib/components/Charts/PieChart/PieChart.stories.d.ts

@@ -0,0 +1,7 @@
+import { Meta, StoryObj } from '@storybook/react';
+import PieChart from './PieChart';
+declare const meta: Meta<typeof PieChart>;
+export default meta;
+type Story = StoryObj<typeof PieChart>;
+export declare const PieChartDashBoard: Story;
+export declare const PieChartDashBoardWithBorder: Story;

package/lib/components/Charts/PieChart/index.d.ts

@@ -0,0 +1 @@
+export { default } from './PieChart';

package/lib/components/Charts/PieChart/types.d.ts

@@ -0,0 +1,27 @@
+export type Status = {
+    status: 'Passed';
+    value: number;
+};
+export interface PieChartProps {
+    radius: number;
+    data: Array<{
+        label: string;
+        value: number;
+    }>;
+    colors: string[];
+    chartBorder: boolean;
+}
+export type ArcParams = {
+    x: number;
+    y: number;
+    radius: number;
+    startAngle: number;
+    endAngle: number;
+};
+export type ArcResult = string;
+export type ArcAnglesResult = {
+    endAngle: number;
+    backgroundArcPath: string;
+    foregroundArcPath: string;
+    percentage: number;
+};

package/lib/components/Charts/RadialChart/RadialChart.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import './RadialChart.scss';
+import { RadialChartProps } from './types';
+declare const RadialChart: React.FC<RadialChartProps>;
+export default RadialChart;

package/lib/components/Charts/RadialChart/RadialChart.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react';
+import RadialChart from './RadialChart';
+declare const meta: Meta<typeof RadialChart>;
+export default meta;
+type Story = StoryObj<typeof RadialChart>;
+export declare const ChartWithStatus: Story;

package/lib/components/Charts/RadialChart/index.d.ts

@@ -0,0 +1 @@
+export { default } from './RadialChart';

package/lib/components/Charts/RadialChart/types.d.ts

@@ -0,0 +1,25 @@
+export type Status = {
+    status: 'Passed' | 'Failed' | 'Warning' | 'Skipped' | 'passed' | 'failed' | 'warning' | 'skipped';
+    value: number;
+};
+export interface RadialChartProps {
+    radius: number;
+    lineWidth: number;
+    statusValues: Status[];
+    onClick?: (status: Status) => void;
+    fontSize: number;
+}
+export type ArcParams = {
+    x: number;
+    y: number;
+    radius: number;
+    startAngle: number;
+    endAngle: number;
+};
+export type ArcResult = string;
+export type ArcAnglesResult = {
+    endAngle: number;
+    backgroundArcPath: string;
+    foregroundArcPath: string;
+    percentage: number;
+};

package/lib/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import './Checkbox.scss';
+import { CheckboxProps } from './types';
+import '../../assets/styles/_colors.scss';
+declare const Checkbox: React.FC<CheckboxProps>;
+export default Checkbox;

package/lib/components/Checkbox/Checkbox.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta, StoryObj } from '@storybook/react';
+import Checkbox from './Checkbox';
+declare const meta: Meta<typeof Checkbox>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Partial: Story;
+export declare const Controlled: Story;

package/lib/components/Checkbox/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Checkbox';

package/lib/components/Checkbox/types.d.ts

@@ -0,0 +1,30 @@
+export interface CheckboxProps {
+    /**
+     * Unique ID for the checkbox input
+     */
+    id?: string;
+    /**
+     * Name attribute for the checkbox input
+     */
+    name?: string;
+    /**
+     * Optional side label
+     */
+    label?: string;
+    /**
+     * Optional disable attribute
+     */
+    disabled?: boolean;
+    /**
+     * Optional checked attribute to prefill
+     */
+    checked?: boolean;
+    /**
+     * Optional onChange function
+     */
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * For partially checked checkbox
+     */
+    partial?: boolean;
+}

package/lib/components/Chip/Chip.d.ts

@@ -0,0 +1,4 @@
+import './Chip.scss';
+import { ChipsProps } from './types';
+declare const Chip: ({ label, fullText, variant, onClick, }: ChipsProps) => import("react/jsx-runtime").JSX.Element;
+export default Chip;

package/lib/components/Chip/Chip.stories.d.ts

@@ -0,0 +1,14 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Chip from './Chip';
+import '../../assets/styles/_colors.scss';
+import './Chip.scss';
+declare const meta: Meta<typeof Chip>;
+type Story = StoryObj<typeof Chip>;
+export declare const Primary: Story;
+export declare const withoutExpand: Story;
+export declare const Group: Story;
+export declare const CustomChip: Story;
+export declare const Success: Story;
+export declare const Errors: Story;
+export declare const Warning: Story;
+export default meta;

package/lib/components/Chip/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Chip';

package/lib/components/Chip/types.d.ts

@@ -0,0 +1,18 @@
+export interface ChipsProps {
+    /**
+     * The text to be displayed on the Chip.
+     */
+    label: string;
+    /**
+     * The text to be displayed on hover.
+     */
+    fullText?: string;
+    /**
+     * The variant of the Chip.
+     */
+    variant?: 'primary' | 'success' | 'error' | 'warning' | 'custom';
+    /**
+     * The callback function to be executed when the Chip is clicked.
+     */
+    onClick?: () => void;
+}

package/lib/components/DatePicker/DatePicker.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import './DatePicker.scss';
+import { DatePickerProps } from './types';
+declare const CustomDatePicker: React.FC<DatePickerProps>;
+export default CustomDatePicker;

package/lib/components/DatePicker/DatePicker.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import CustomDatePicker from './DatePicker';
+declare const meta: Meta<typeof CustomDatePicker>;
+export default meta;
+type Story = StoryObj<typeof CustomDatePicker>;
+export declare const Default: Story;
+export declare const StartDateFilter: Story;
+export declare const EndDateInput: Story;
+export declare const ScheduleDateInput: Story;

package/lib/components/DatePicker/Timepicker.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TimePickerProps } from './types';
+declare const TimePicker: React.FC<TimePickerProps>;
+export default TimePicker;

package/lib/components/DatePicker/index.d.ts

@@ -0,0 +1 @@
+export { default } from './DatePicker';