@campxdev/react-blueprint 1.9.6 → 2.0.1

package/src/stories/Input/SingleSelect.stories.tsx

@@ -1,131 +0,0 @@
-// Import React and other necessary elements
-import { Meta } from '@storybook/react';
-import {
-  SingleSelect,
-  SingleSelectProps,
-} from '../../components/Input/SingleSelect/SingleSelect';
-
-// Make sure your TextField import is correct
-
-const topFilms = [
-  { label: 'The Shawshank Redemption', value: 1994, subLabel: 'Gowtham' },
-  { label: 'The Godfather', value: 1972 },
-  { label: 'The Godfather: Part II', value: 1974 },
-  { label: 'The Dark Knight', value: 2008 },
-  { label: '12 Angry Men', value: 1957 },
-  { label: "Schindler's List", value: 1993 },
-  { label: 'Pulp Fiction', value: 1994 },
-  {
-    label: 'The Lord of the Rings: The Return of the King',
-    value: 2003,
-  },
-  { label: 'The Good, the Bad and the Ugly', value: 1966 },
-  { label: 'Fight Club', value: 1999 },
-  {
-    label: 'The Lord of the Rings: The Fellowship of the Ring',
-    value: 2001,
-  },
-  {
-    label: 'Star Wars: Episode V - The Empire Strikes Back',
-    value: 1980,
-  },
-  { label: 'Forrest Gump', value: 1994 },
-  { label: 'Inception', value: 2010 },
-  {
-    label: 'The Lord of the Rings: The Two Towers',
-    value: 2002,
-  },
-  { label: "One Flew Over the Cuckoo's Nest", value: 1975 },
-  { label: 'Goodfellas', value: 1990 },
-  { label: 'The Matrix', value: 1999 },
-  { label: 'Seven Samurai', value: 1954 },
-  {
-    label: 'Star Wars: Episode IV - A New Hope',
-    value: 1977,
-  },
-  { label: 'City of God', value: 2002 },
-  { label: 'Se7en', value: 1995 },
-  { label: 'The Silence of the Lambs', value: 1991 },
-  { label: "It's a Wonderful Life", value: 1946 },
-  { label: 'Life Is Beautiful', value: 1997 },
-  { label: 'The Usual Suspects', value: 1995 },
-  { label: 'Léon: The Professional', value: 1994 },
-  { label: 'Spirited Away', value: 2001 },
-  { label: 'Saving Private Ryan', value: 1998 },
-  { label: 'Once Upon a Time in the West', value: 1968 },
-  { label: 'American History X', value: 1998 },
-  { label: 'Interstellar', value: 2014 },
-];
-// Define the default export with Meta type including the component type
-export default {
-  title: 'Input/SingleSelect',
-  component: SingleSelect,
-  argTypes: {
-    label: {
-      control: 'text',
-      description: 'Label of the field',
-    },
-    required: {
-      control: 'boolean',
-      description: 'Required property of the field',
-    },
-    optionsApiEndPoint: {
-      control: 'text',
-      description: 'API end point for options',
-    },
-    useCampxAxios: {
-      control: 'boolean',
-      description: 'Boolean to use campx axios',
-    },
-  },
-} as Meta<typeof SingleSelect>;
-
-export const Default = {
-  render: (args: SingleSelectProps) => <SingleSelect {...args} />,
-  args: {
-    required: true,
-    label: 'Single Select',
-    onChange: () => {},
-  },
-};
-export const Primary = {
-  render: (args: SingleSelectProps) => <SingleSelect {...args} />,
-  args: {
-    options: topFilms,
-    label: 'Single Select',
-    required: false,
-    onChange: () => {},
-  },
-};
-
-export const WithAPIEndPoint = {
-  render: (args: SingleSelectProps) => <SingleSelect {...args} />,
-  args: {
-    optionsApiEndPoint: 'dropdowns/classrooms',
-    label: 'Select Classroom',
-    required: false,
-    onChange: () => {},
-  },
-};
-
-export const SingleSelectWithValue = {
-  render: (args: SingleSelectProps) => <SingleSelect {...args} />,
-  args: {
-    label: 'Select Select',
-    options: topFilms,
-    required: true,
-    value: 1994,
-    onChange: () => {},
-  },
-};
-
-export const SingleSelectWithValueAndApi = {
-  render: (args: SingleSelectProps) => <SingleSelect {...args} />,
-  args: {
-    optionsApiEndPoint: 'dropdowns/classrooms',
-    label: 'Select Classroom',
-    required: true,
-    value: 1,
-    onChange: () => {},
-  },
-};

package/src/stories/Input/Switch.stories.tsx

@@ -1,61 +0,0 @@
-// Import React and other necessary elements
-import { Meta } from '@storybook/react';
-import { Switch, SwitchProps } from '../../components/Input/Switch/Switch';
-
-// Make sure your TextField import is correct
-
-// Define the default export with Meta type including the component type
-export default {
-  title: 'Input/Switch',
-  component: Switch,
-  tags: ['autodocs'],
-  argTypes: {
-    variant: {
-      control: 'select',
-      options: ['contained', 'outlined', 'text', 'string'],
-      description: 'The Switch Variant to use',
-    },
-    children: {
-      control: 'text',
-      description: 'text in Switch',
-    },
-    color: {
-      control: 'select',
-      options: ['primary', 'secondary'],
-      description: 'The Switch Variant to use',
-    },
-    disabled: {
-      control: 'boolean',
-      description: 'Disabled Switch',
-      defaultValue: false,
-    },
-  },
-} as Meta<typeof Switch>;
-
-// Define stories directly as objects with render function
-export const Primary = {
-  render: (args: SwitchProps) => <Switch {...args} />,
-  args: {
-    color: 'primary',
-    variant: 'contained',
-    children: 'Primary Switch',
-  },
-};
-
-export const Secondary = {
-  render: (args: SwitchProps) => <Switch {...args} />,
-  args: {
-    color: 'secondary',
-    variant: 'contained',
-    children: 'Secondary Switch',
-  },
-};
-
-export const Disabled = {
-  render: (args: SwitchProps) => <Switch {...args} />,
-  args: {
-    disabled: true,
-    variant: 'contained',
-    children: 'Disabled Switch',
-  },
-};

package/src/stories/Input/Tags.stories.tsx

@@ -1,43 +0,0 @@
-// Import React and other necessary elements
-import { Meta } from '@storybook/react';
-import { Tags } from '../../components/Input/Tags/Tags';
-
-const sampleTags = [
-  {
-    label: 'Tag1',
-    value: 1,
-  },
-  {
-    label: 'Tag2',
-    value: 2,
-  },
-  {
-    label: 'Tag3',
-    value: 3,
-  },
-];
-
-// Define the default export with Meta type including the component type
-export default {
-  title: 'Input/Tags',
-  component: Tags,
-  tags: ['autodocs'],
-  argTypes: {},
-} as Meta<typeof Tags>;
-
-// Define stories directly as objects with render function
-export const Default = {
-  render: () => <Tags tags={sampleTags} />,
-  args: {},
-};
-
-export const DeletableTag = {
-  render: () => (
-    <Tags
-      tags={sampleTags}
-      onDelete={(deletedChip) => {
-        console.log(deletedChip);
-      }}
-    />
-  ),
-};

package/src/stories/Input/TextField.stories.tsx

@@ -1,153 +0,0 @@
-// Import React and other necessary elements
-import { Meta } from '@storybook/react';
-
-// Make sure your TextField import is correct
-import { InputAdornment as MuiInputAdornment } from '@mui/material';
-import { Icons } from '../../components/Assets/Icons/Icons';
-
-import { TextField, TextFieldProps, Tooltip } from '../../components/export';
-import { ToolTipContent } from '../../components/Feedback/Tooltip/ToolTipContent';
-
-// Define the default export with Meta type including the component type
-export default {
-  title: 'Input/TextField',
-  component: TextField,
-  tags: ['autodocs'],
-  argTypes: {
-    name: {
-      control: 'text',
-      description: 'The name of the input field, used in form submissions.',
-    },
-    label: {
-      control: 'text',
-      description: 'The label text displayed above the input field.',
-    },
-    value: {
-      control: 'text',
-      description: 'The input value of the TextField.',
-    },
-    required: {
-      control: 'boolean',
-      description: 'Specifies if the field is required for form submission.',
-    },
-    placeholder: {
-      control: 'text',
-      description: 'The placeholder value of the TextField.',
-    },
-    disabled: {
-      control: 'boolean',
-      description: 'Controls whether the TextField is disabled or not.',
-    },
-    helperText: {
-      control: 'text',
-      description:
-        'Helper text that appears below the text field to provide additional guidance.',
-    },
-    error: {
-      control: 'boolean',
-      description: 'Shows how the error message is shown',
-    },
-  },
-} as Meta<typeof TextField>;
-
-// Define stories directly as objects with render function
-export const Primary = {
-  render: (args: TextFieldProps) => <TextField {...args} />,
-  args: {
-    label: 'First Name',
-    name: 'firstName',
-    value: '',
-    required: true,
-    helperText: '',
-  },
-};
-
-export const Disabled = {
-  render: (args: TextFieldProps) => <TextField {...args} />,
-  args: {
-    label: 'Disabled Input',
-    name: 'disabledInput',
-    value: 'Disabled',
-    required: false,
-    disabled: true,
-  },
-};
-
-export const WithValue = {
-  render: (args: TextFieldProps) => <TextField {...args} />,
-  args: {
-    label: 'Last Name',
-    name: 'lastName',
-    value: 'Doe',
-    required: false,
-  },
-};
-
-export const InputWithPlaceholder = {
-  render: (args: TextFieldProps) => <TextField {...args} />,
-  args: {
-    label: 'Mobile',
-    value: '',
-    placeholder: '10 digit phone number',
-  },
-};
-
-export const ErrorInput = {
-  render: (args: TextFieldProps) => <TextField {...args} />,
-  args: {
-    label: 'First Name',
-    required: true,
-    value: '',
-    error: true,
-    helperText: "Name can't be empty",
-  },
-};
-
-export const SuccessInput = {
-  render: (args: TextFieldProps) => <TextField {...args} />,
-  args: {
-    label: 'Pan Card',
-    required: true,
-    value: 'KAHPS9888B',
-    color: 'success',
-    helperText: 'Pan Card Successfully Verified',
-    focused: true,
-  },
-};
-
-export const WarningInput = {
-  render: (args: TextFieldProps) => <TextField {...args} />,
-  args: {
-    label: 'Pan Card',
-    required: true,
-    value: 'KAHPS9888B',
-    color: 'warning',
-    helperText: `Pan Card doesn't match with the provided name`,
-    focused: true,
-  },
-};
-
-export const InfoInput = {
-  render: (args: TextFieldProps) => <TextField {...args} />,
-  args: {
-    label: 'Info',
-    required: true,
-    InputProps: {
-      endAdornment: (
-        <MuiInputAdornment position="end">
-          <Tooltip
-            title={
-              <ToolTipContent
-                message={
-                  'This is the info tooltip !! This is the info tooltip !! This is the info tooltip !!'
-                }
-              />
-            }
-          >
-            <Icons.InfoIcon />
-          </Tooltip>
-        </MuiInputAdornment>
-      ),
-    },
-  },
-};

package/src/stories/Input/TimePicker.stories.tsx

@@ -1,160 +0,0 @@
-import { LocalizationProvider } from '@mui/x-date-pickers';
-import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFnsV3';
-import { Meta, StoryObj } from '@storybook/react/*';
-import { add, isWithinInterval, startOfDay } from 'date-fns';
-import { TimePicker } from '../../components/Input/TimePicker/TimePicker';
-
-const meta: Meta<typeof TimePicker> = {
-  title: 'Input/TimePicker',
-  component: TimePicker,
-  decorators: [
-    (Story) => (
-      <LocalizationProvider dateAdapter={AdapterDateFns}>
-        <Story />
-      </LocalizationProvider>
-    ),
-  ],
-};
-
-export default meta;
-
-type Story = StoryObj<typeof TimePicker>;
-
-export const Primary: Story = {
-  args: {
-    label: 'Time Picker (Hours Minutes Meridian)',
-    name: 'time-picker',
-    required: true,
-  },
-};
-
-export const Secondary: Story = {
-  args: {
-    ...Primary.args,
-    label: 'Time Picker (Hours Minutes Seconds Meridian)',
-    format: 'HH:mm:ss a',
-    views: ['hours', 'minutes', 'seconds'],
-  },
-};
-
-export const Tertiary: Story = {
-  args: {
-    ...Primary.args,
-    label: 'Time Picker (Hours Minutes - 24hr Format)',
-    format: 'HH:mm',
-    ampm: false,
-  },
-};
-
-export const Quaternary: Story = {
-  args: {
-    ...Primary.args,
-    label: 'Time Picker (Hours Minutes Seconds - 24hr Format)',
-    format: 'HH:mm:ss',
-    ampm: false,
-    views: ['hours', 'minutes', 'seconds'],
-  },
-};
-
-export const WithDefaultValue: Story = {
-  args: {
-    ...Primary.args,
-    label: 'With Default Value',
-    required: false,
-    value: new Date('2024/9/15 15:30'),
-  },
-};
-
-export const WithPlaceHolderHelperText: Story = {
-  args: {
-    ...Primary.args,
-    label: 'With Placeholder & Helper Text',
-    required: false,
-    placeholder: 'Select Time',
-    helperText: 'Mandatory field',
-  },
-};
-
-export const WithDifferentTimeSteps: Story = {
-  args: {
-    ...Primary.args,
-    label: 'With Time Steps',
-    required: false,
-    timeSteps: { hours: 2, minutes: 15 },
-  },
-};
-
-export const DisablePast: Story = {
-  args: {
-    ...Primary.args,
-    label: 'Disable Past',
-    format: 'HH:mm',
-    ampm: false,
-    required: false,
-    disablePast: true,
-  },
-};
-
-export const DisableFuture: Story = {
-  args: {
-    ...Primary.args,
-    label: 'Disable Future',
-    format: 'HH:mm',
-    ampm: false,
-    required: false,
-    disableFuture: true,
-  },
-};
-
-export const MinimumTime: Story = {
-  args: {
-    ...Primary.args,
-    label: 'With Minimum Time (9AM)',
-    format: 'HH:mm',
-    ampm: false,
-    required: false,
-    minTime: new Date('2024/9/15 09:00'),
-  },
-};
-
-export const MaximumTime: Story = {
-  args: {
-    ...Primary.args,
-    label: 'With Maximum Time (5PM)',
-    format: 'HH:mm',
-    ampm: false,
-    required: false,
-    maxTime: new Date('2024/9/15 17:00'),
-  },
-};
-
-export const DisableSpecificTime: Story = {
-  args: {
-    ...Primary.args,
-    label: 'Disable Specific Time (12AM - 9AM)',
-    ampm: false,
-    required: false,
-    shouldDisableTime: (
-      time: Date,
-      clockType: 'hours' | 'minutes' | 'seconds',
-    ) => {
-      if (clockType === 'hours') {
-        const today = startOfDay(new Date());
-        const startTime = today;
-        const endTime = add(today, { hours: 8 });
-        return isWithinInterval(time, { start: startTime, end: endTime });
-      }
-      return false;
-    },
-  },
-};
-
-export const ReadOnly: Story = {
-  args: {
-    ...Primary.args,
-    label: 'Read Only',
-    required: false,
-    disabled: true,
-    value: new Date('2024/9/15 15:30'),
-  },
-};

package/src/stories/Layout/AppHeader.stories.tsx

@@ -1,46 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react';
-
-import { Box } from '@mui/material';
-import {
-  AppHeader,
-  AppHeaderProps,
-} from '../../components/Layout/AppHeader/AppHeader';
-
-// Define the default export with Meta type including the component type
-const meta: Meta<typeof AppHeader> = {
-  title: 'Layout/AppHeader',
-  component: AppHeader,
-  tags: ['autodocs'],
-  argTypes: {
-    actions: {
-      control: 'object',
-      description: 'Custom actions to be displayed.',
-    },
-  },
-};
-
-export default meta;
-type Story = StoryObj<typeof AppHeader>;
-
-// Primary story
-export const Primary: Story = {
-  render: (args: AppHeaderProps) => (
-    <Box
-      sx={{
-        width: '100%',
-        height: '300px',
-        alignContent: 'center',
-        justifyContent: 'center',
-      }}
-    >
-      <AppHeader {...args} />
-    </Box>
-  ),
-  args: {
-    clientName: 'Anurag University',
-    actions: [<p>asdjflsf</p>],
-    // appsMenu: <AppsMenu apps={["exams", "square", "admin"]} />,
-    userFullName: 'Srikanth Yellapragada',
-    collapsed: false,
-  },
-};

package/src/stories/Layout/TabsLayout.stories.tsx

@@ -1,53 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react/*';
-import { TabsLayout } from '../../components/export';
-
-const meta: Meta<typeof TabsLayout> = {
-  title: 'Layout/TabsLayout',
-  component: TabsLayout,
-  argTypes: {},
-};
-export default meta;
-
-type Story = StoryObj<typeof TabsLayout>;
-
-export const Primary: Story = {
-  args: {
-    menu: [
-      {
-        path: 'degrees',
-        title: 'Degrees',
-        permissionKey: 'degreesPermission',
-      },
-      {
-        path: 'calendar',
-        title: 'Academic Calendar',
-        permissionKey: 'calendarPermission',
-      },
-      {
-        path: 'programs',
-        title: 'Programs',
-        permissionKey: 'programsPermission',
-      },
-      {
-        path: 'semester',
-        title: 'Semester',
-        permissionKey: 'semesterPermission',
-      },
-      {
-        path: 'courses',
-        title: 'Courses',
-        permissionKey: 'coursesPermission',
-      },
-      {
-        path: 'professors',
-        title: 'Professors',
-        permissionKey: 'professorsPermission',
-      },
-      {
-        path: 'Faculties',
-        title: 'Faculties',
-        permissionKey: 'facultiesPermission',
-      },
-    ],
-  },
-};