this.gui 1.0.18 → 1.1.0

package/src/stories/Molecules/VideoWithDescription/VideoWithDescription.jsx

@@ -1,25 +0,0 @@
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import './VideoWithDescription.css';
-
-/**
- * VideoWithDescription component
- */
-export const VideoWithDescription = (props) => {
-  return (
-    <div className="videowithdescription" {...props}>
-      {/* Component implementation */}
-    </div>
-  );
-};
-
-VideoWithDescription.propTypes = {
-  // Define prop types here
-};
-
-VideoWithDescription.defaultProps = {
-  // Define default props here
-};
-
-export default VideoWithDescription;

package/src/stories/Molecules/VideoWithDescription/VideoWithDescription.stories.jsx

@@ -1,20 +0,0 @@
-
-import { VideoWithDescription } from './VideoWithDescription';
-
-// Storybook configuration for VideoWithDescription component
-export default {
-  title: 'Molecules/MediaMolecules/VideoWithDescription',
-  component: VideoWithDescription,
-  parameters: {
-    layout: 'centered',
-  },
-  argTypes: {
-    // Define argTypes here
-  },
-};
-
-export const Default = {
-  args: {
-    // Define default args here
-  },
-};

package/src/stories/Molecules/index.js

@@ -1,58 +0,0 @@
-// src/stories/Molecules/index.js
-// Import all components as named exports
-import { Navbar } from './Navbar/Navbar';
-import { Sidebar } from './Sidebar/Sidebar';
-import { Breadcrumbs } from './Breadcrumbs/Breadcrumbs';
-import { Dropdown } from './Dropdown/Dropdown';
-import { InputGroup } from './InputGroup/InputGroup';
-import { InputWithLabel } from './InputWithLabel/InputWithLabel';
-import { SearchBar } from './SearchBar/SearchBar';
-import { FileUpload } from './FileUpload/FileUpload';
-import { FormField } from './FormField/FormField';
-import { IconButton } from './IconButton/IconButton';
-import { ButtonGroup } from './ButtonGroup/ButtonGroup';
-import { ImageWithCaption } from './ImageWithCaption/ImageWithCaption';
-import { VideoWithDescription } from './VideoWithDescription/VideoWithDescription';
-import { AvatarWithName } from './AvatarWithName/AvatarWithName';
-import { AudioPlayer } from './AudioPlayer/AudioPlayer';
-import { Card } from './Card/Card';
-import { MediaCard } from './MediaCard/MediaCard';
-import { List } from './List/List';
-import { Accordion } from './Accordion/Accordion';
-import { Notification } from './Notification/Notification';
-import { Modal } from './Modal/Modal';
-import { DataTable } from './DataTable/DataTable';
-import { PricingTable } from './PricingTable/PricingTable';
-import { ComparisonTable } from './ComparisonTable/ComparisonTable';
-import { SelectTheme } from './SelectTheme/SelectTheme'; 
-
-// Flattened export of all components
-const Molecules = {
-  Navbar,
-  Sidebar,
-  Dropdown,
-  Breadcrumbs,
-  InputGroup,
-  InputWithLabel,
-  SearchBar,
-  SelectTheme,  
-  FileUpload,
-  FormField,
-  IconButton,
-  ButtonGroup,
-  ImageWithCaption,
-  VideoWithDescription,
-  AvatarWithName,
-  AudioPlayer,
-  Card,
-  MediaCard,
-  List,
-  Accordion,
-  Notification,
-  Modal,
-  DataTable,
-  PricingTable,
-  ComparisonTable,
-};
-
-export default Molecules;

package/src/stories/Molecules/meta_Molecules.js

@@ -1,47 +0,0 @@
-const Molecules = {
-  "Molecules": {
-    "Navigation": [
-      { name: "Navbar", paths: { css: "./Navbar/Navbar.css", globalCss: "styles/global.css", jsx: "./Navbar/Navbar.jsx", stories: "./Navbar/Navbar.stories.jsx" }},
-      { name: "Sidebar", paths: { css: "./Sidebar/Sidebar.css", globalCss: "styles/global.css", jsx: "./Sidebar/Sidebar.jsx", stories: "./Sidebar/Sidebar.stories.jsx" }},
-      { name: "Breadcrumbs", paths: { css: "./Breadcrumbs/Breadcrumbs.css", globalCss: "styles/global.css", jsx: "./Breadcrumbs/Breadcrumbs.jsx", stories: "./Breadcrumbs/Breadcrumbs.stories.jsx" }},
-    ],
-    "Menus": [
-      { name: "Dropdown", paths: { css: "./Dropdown/Dropdown.css", globalCss: "styles/global.css", jsx: "./Layout/Dropdown/Dropdown.jsx", stories: "src/stories/Layout/Dropdown/Dropdown.stories.jsx" }},
-    ],
-    "FormElements": [
-      { name: "InputGroup ", paths: { css: "./InputGroup/InputGroup.css", globalCss: "styles/global.css", jsx: "./InputGroup/InputGroup.jsx", stories: "src/stories/Molecules/InputGroup/InputGroup.stories.jsx" }},
-      { name: "InputWithLabel", paths: { css: "./InputWithLabel/InputWithLabel.css", globalCss: "styles/global.css", jsx: "./InputWithLabel/InputWithLabel.jsx", stories: "src/stories/Molecules/InputWithLabel/InputWithLabel.stories.jsx" }},
-      { name: "SearchBar", paths: { css: "./SearchBar/SearchBar.css", globalCss: "styles/global.css", jsx: "./SearchBar/SearchBar.jsx", stories: "src/stories/Molecules/SearchBar/SearchBar.stories.jsx" }},
-      { name: "FileUpload", paths: { css: "./FileUpload/FileUpload.css", globalCss: "styles/global.css", jsx: "./FileUpload/FileUpload.jsx", stories: "src/stories/Molecules/FileUpload/FileUpload.stories.jsx" }},
-      { name: "FormField", paths: { css: "./FormField/FormField.css", globalCss: "styles/global.css", jsx: "./FormField/FormField.jsx", stories: "src/stories/Molecules/FormField/FormField.stories.jsx" }},
-    ],
-    "ButtonsWithIcons": [
-      { name: "IconButton", paths: { css: "./IconButton/IconButton.css", globalCss: "styles/global.css", jsx: "./IconButton/IconButton.jsx", stories: "src/stories/Molecules/IconButton/IconButton.stories.jsx" }},
-      { name: "ButtonGroup", paths: { css: "./ButtonGroup/ButtonGroup.css", globalCss: "styles/global.css", jsx: "./ButtonGroup/ButtonGroup.jsx", stories: "src/stories/Molecules/ButtonGroup/ButtonGroup.stories.jsx" }},
-    ],
-    "Media": [
-      { name: "ImageWithCaption", paths: { css: "./ImageWithCaption/ImageWithCaption.css", globalCss: "styles/global.css", jsx: "./ImageWithCaption/ImageWithCaption.jsx", stories: "src/stories/Molecules/ImageWithCaption/ImageWithCaption.stories.jsx" }},
-      { name: "VideoWithDescription", paths: { css: "./VideoWithDescription/VideoWithDescription.css", globalCss: "styles/global.css", jsx: "./VideoWithDescription/VideoWithDescription.jsx", stories: "src/stories/Molecules/VideoWithDescription/VideoWithDescription.stories.jsx" }},
-      { name: "AudioPlayer", paths: { css: "./AudioPlayer/AudioPlayer.css", globalCss: "styles/global.css", jsx: "./AudioPlayer/AudioPlayer.jsx", stories: "src/stories/Molecules/AudioPlayer/AudioPlayer.stories.jsx" }},
-    ],
-    "Display": [
-      { name: "SelectTheme", paths: { css: "./SelectTheme/SelectTheme.css", globalCss: "styles/global.css", jsx: "./SelectTheme/SelectTheme.jsx", stories: "src/stories/Molecules/SelectTheme/SelectTheme.stories.jsx" }},
-      { name: "Card", paths: { css: "./Card/Card.css", globalCss: "styles/global.css", jsx: "./Card/Card.jsx", stories: "./Card/Card.stories.jsx" }},
-      { name: "MediaCard", paths: { css: "./MediaCard/MediaCard.css", globalCss: "styles/global.css", jsx: "./MediaCard/MediaCard.jsx", stories: "./MediaCard/MediaCard.stories.jsx" }},
-      { name: "List", paths: { css: "./List/List.css", globalCss: "styles/global.css", jsx: "./List/List.jsx", stories: "./List/List.stories.jsx" }},
-      { name: "Accordion", paths: { css: "./Accordion/Accordion.css", globalCss: "styles/global.css", jsx: "./Accordion/Accordion.jsx", stories: "./Accordion/Accordion.stories.jsx" }},
-      { name: "AvatarWithName", paths: { css: "./AvatarWithName/AvatarWithName.css", globalCss: "styles/global.css", jsx: "./AvatarWithName/AvatarWithName.jsx", stories: "src/stories/Molecules/AvatarWithName/AvatarWithName.stories.jsx" }},
-    ],
-    "FeedbackMolecules": [
-      { name: "Notification", paths: { css: "./Notification/Notification.css", globalCss: "styles/global.css", jsx: "./Notification/Notification.jsx", stories: "src/stories/Molecules/Notification/Notification.stories.jsx" }},
-      { name: "Modal", paths: { css: "./Modal/Modal.css", globalCss: "styles/global.css", jsx: "./Modal/Modal.jsx", stories: "src/stories/Molecules/Modal/Modal.stories.jsx" }},
-    ],
-    "Tables": [
-      { name: "DataTable", paths: { css: "./DataTable/DataTable.css", globalCss: "styles/global.css", jsx: "./DataTable/DataTable.jsx", stories: "./DataTable/DataTable.stories.jsx" }},
-      { name: "PricingTable", paths: { css: "./PricingTable/PricingTable.css", globalCss: "styles/global.css", jsx: "./PricingTable/PricingTable.jsx", stories: "./PricingTable/PricingTable.stories.jsx" }},
-      { name: "ComparisonTable", paths: { css: "./ComparisonTable/ComparisonTable.css", globalCss: "styles/global.css", jsx: "./ComparisonTable/ComparisonTable.jsx", stories: "./ComparisonTable/ComparisonTable.stories.jsx" }},
-    ]
-  }
-}
-
-export default Molecules;

package/src/stories/Organisms/Profile/UserFriends/UserFriends.context.jsx

@@ -1,15 +0,0 @@
-
-import React, { createContext, useContext, useState } from 'react';
-
-const UserFriendsContext = createContext();
-
-export const UserFriendsProvider = ({ children }) => {
-  const [state, setState] = useState(null);
-  return (
-    <UserFriendsContext.Provider value={[state, setState]}>
-      {children}
-    </UserFriendsContext.Provider>
-  );
-};
-
-export const useUserFriends = () => useContext(UserFriendsContext);

package/src/stories/Organisms/Profile/UserFriends/UserFriends.css

@@ -1,4 +0,0 @@
-
-.userfriends {
-  /* Add your styles here */
-}

package/src/stories/Organisms/Profile/UserFriends/UserFriends.jsx

@@ -1,13 +0,0 @@
-
-import React from 'react';
-import './UserFriends.css';
-
-const UserFriends = () => {
-  return (
-    <div className="userfriends">
-      <h1>UserFriends Component</h1>
-    </div>
-  );
-};
-
-export default UserFriends;

package/src/stories/Organisms/Profile/UserFriends/UserFriends.stories.jsx

@@ -1,26 +0,0 @@
-
-import React from 'react';
-import UserFriends from './UserFriends';
-
-export default {
-  title: '_Organisms/UserFriends',
-  component: UserFriends,
-  parameters: {
-    docs: {
-      description: {
-        component: 'UserFriends is a reusable component for the Profile category.'
-      }
-    }
-  },
-  argTypes: {
-    exampleProp: {
-      control: 'text',
-      description: 'An example prop for the UserFriends component.'
-    },
-  }
-};
-
-export const Default = (args) => <UserFriends {...args} />;
-Default.args = {
-  exampleProp: 'Default Text'
-};

package/src/stories/Organisms/Profile/UserPosts/UserPosts.context.jsx

@@ -1,15 +0,0 @@
-
-import React, { createContext, useContext, useState } from 'react';
-
-const UserPostsContext = createContext();
-
-export const UserPostsProvider = ({ children }) => {
-  const [state, setState] = useState(null);
-  return (
-    <UserPostsContext.Provider value={[state, setState]}>
-      {children}
-    </UserPostsContext.Provider>
-  );
-};
-
-export const useUserPosts = () => useContext(UserPostsContext);

package/src/stories/Organisms/Profile/UserPosts/UserPosts.css

@@ -1,4 +0,0 @@
-
-.userposts {
-  /* Add your styles here */
-}

package/src/stories/Organisms/Profile/UserPosts/UserPosts.jsx

@@ -1,13 +0,0 @@
-
-import React from 'react';
-import './UserPosts.css';
-
-const UserPosts = () => {
-  return (
-    <div className="userposts">
-      <h1>UserPosts Component</h1>
-    </div>
-  );
-};
-
-export default UserPosts;

package/src/stories/Organisms/Profile/UserPosts/UserPosts.stories.jsx

@@ -1,26 +0,0 @@
-
-import React from 'react';
-import UserPosts from './UserPosts';
-
-export default {
-  title: '_Organisms/UserPosts',
-  component: UserPosts,
-  parameters: {
-    docs: {
-      description: {
-        component: 'UserPosts is a reusable component for the Profile category.'
-      }
-    }
-  },
-  argTypes: {
-    exampleProp: {
-      control: 'text',
-      description: 'An example prop for the UserPosts component.'
-    },
-  }
-};
-
-export const Default = (args) => <UserPosts {...args} />;
-Default.args = {
-  exampleProp: 'Default Text'
-};

package/src/stories/Organisms/Profile/UserProfile/UserProfile.context.jsx

@@ -1,15 +0,0 @@
-
-import React, { createContext, useContext, useState } from 'react';
-
-const UserProfileContext = createContext();
-
-export const UserProfileProvider = ({ children }) => {
-  const [state, setState] = useState(null);
-  return (
-    <UserProfileContext.Provider value={[state, setState]}>
-      {children}
-    </UserProfileContext.Provider>
-  );
-};
-
-export const useUserProfile = () => useContext(UserProfileContext);

package/src/stories/Organisms/Profile/UserProfile/UserProfile.css

@@ -1,4 +0,0 @@
-
-.userprofile {
-  /* Add your styles here */
-}

package/src/stories/Organisms/Profile/UserProfile/UserProfile.jsx

@@ -1,13 +0,0 @@
-
-import React from 'react';
-import './UserProfile.css';
-
-const UserProfile = () => {
-  return (
-    <div className="userprofile">
-      <h1>UserProfile Component</h1>
-    </div>
-  );
-};
-
-export default UserProfile;

package/src/stories/Organisms/Profile/UserProfile/UserProfile.stories.jsx

@@ -1,26 +0,0 @@
-
-import React from 'react';
-import UserProfile from './UserProfile';
-
-export default {
-  title: '_Organisms/UserProfile',
-  component: UserProfile,
-  parameters: {
-    docs: {
-      description: {
-        component: 'UserProfile is a reusable component for the Profile category.'
-      }
-    }
-  },
-  argTypes: {
-    exampleProp: {
-      control: 'text',
-      description: 'An example prop for the UserProfile component.'
-    },
-  }
-};
-
-export const Default = (args) => <UserProfile {...args} />;
-Default.args = {
-  exampleProp: 'Default Text'
-};

package/src/stories/Organisms/meta_Organisms.js

@@ -1,39 +0,0 @@
-const organisms = {
-  "Organisms": {
-    "Forms": [
-      { name: "SignInForm", paths: { css: "./SignInForm/SignInForm.css", globalCss: "styles/global.css", jsx: "./SignInForm/SignInForm.jsx", stories: "./SignInForm/SignInForm.stories.jsx" }},
-      { name: "RegistrationForm", paths: { css: "./RegistrationForm/RegistrationForm.css", globalCss: "styles/global.css", jsx: "./RegistrationForm/RegistrationForm.jsx", stories: "./RegistrationForm/RegistrationForm.stories.jsx" }},
-      { name: "ContactForm", paths: { css: "./ContactForm/ContactForm.css", globalCss: "styles/global.css", jsx: "./ContactForm/ContactForm.jsx", stories: "./ContactForm/ContactForm.stories.jsx" }},
-    ],
-    
-    "ContentDisplay": [
-      { name: "ProfileCard", paths: { css: "./ProfileCard/ProfileCard.css", globalCss: "styles/global.css", jsx: "./ProfileCard/ProfileCard.jsx", stories: "./ProfileCard/ProfileCard.stories.jsx" }},
-      { name: "ProductDetail", paths: { css: "./ProductDetail/ProductDetail.css", globalCss: "styles/global.css", jsx: "./ProductDetail/ProductDetail.jsx", stories: "./ProductDetail/ProductDetail.stories.jsx" }},
-      { name: "ArticleContent", paths: { css: "./ArticleContent/ArticleContent.css", globalCss: "styles/global.css", jsx: "./ArticleContent/ArticleContent.jsx", stories: "./ArticleContent/ArticleContent.stories.jsx" }},
-    ],
-    
-    "MediaCollections": [
-      { name: "ImageGallery", paths: { css: "./ImageGallery/ImageGallery.css", globalCss: "styles/global.css", jsx: "./ImageGallery/ImageGallery.jsx", stories: "./ImageGallery/ImageGallery.stories.jsx" }},
-      { name: "VideoPlaylist", paths: { css: "./VideoPlaylist/VideoPlaylist.css", globalCss: "styles/global.css", jsx: "./VideoPlaylist/VideoPlaylist.jsx", stories: "./VideoPlaylist/VideoPlaylist.stories.jsx" }},
-      { name: "Carousel", paths: { css: "./Carousel/Carousel.css", globalCss: "styles/global.css", jsx: "./Carousel/Carousel.jsx", stories: "./Carousel/Carousel.stories.jsx" }},
-    ],
-    
-    "Interactive": [
-      { name: "ShoppingCart", paths: { css: "./ShoppingCart/ShoppingCart.css", globalCss: "styles/global.css", jsx: "./ShoppingCart/ShoppingCart.jsx", stories: "./ShoppingCart/ShoppingCart.stories.jsx" }},
-      { name: "UserProfile", paths: { css: "./UserProfile/UserProfile.css", globalCss: "styles/global.css", jsx: "./UserProfile/UserProfile.jsx", stories: "./UserProfile/UserProfile.stories.jsx" }},
-      { name: "Checkout", paths: { css: "./Checkout/Checkout.css", globalCss: "styles/global.css", jsx: "./Checkout/Checkout.jsx", stories: "./Checkout/Checkout.stories.jsx" }},
-    ],
-    
-    "MediaCollections": [
-      { name: "ImageGallery", paths: { css: "./ImageGallery/ImageGallery.css", globalCss: "styles/global.css", jsx: "./ImageGallery/ImageGallery.jsx", stories: "./ImageGallery/ImageGallery.stories.jsx" }},
-      { name: "VideoPlaylist", paths: { css: "./VideoPlaylist/VideoPlaylist.css", globalCss: "styles/global.css", jsx: "./VideoPlaylist/VideoPlaylist.jsx", stories: "./VideoPlaylist/VideoPlaylist.stories.jsx" }},
-      { name: "Carousel", paths: { css: "./Carousel/Carousel.css", globalCss: "styles/global.css", jsx: "./Carousel/Carousel.jsx", stories: "./Carousel/Carousel.stories.jsx" }},
-    ],
-
-    "Feedback": [
-      { name: "UserNotification", paths: { css: "./UserNotification/UserNotification.css", globalCss: "styles/global.css", jsx: "./UserNotification/UserNotification.jsx", stories: "./UserNotification/UserNotification.stories.jsx" }},
-      { name: "StatusBanner", paths: { css: "./StatusBanner/StatusBanner.css", globalCss: "styles/global.css", jsx: "./StatusBanner/StatusBanner.jsx", stories: "./StatusBanner/StatusBanner.stories.jsx" }},
-      { name: "AlertSystem", paths: { css: "./AlertSystem/AlertSystem.css", globalCss: "styles/global.css", jsx: "./AlertSystem/AlertSystem.jsx", stories: "./AlertSystem/AlertSystem.stories.jsx" }},
-    ]
-  }
-}

package/src/stories/Pages/Page/Page.css

@@ -1,69 +0,0 @@
-.storybook-page {
-  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-  font-size: 14px;
-  line-height: 24px;
-  padding: 48px 20px;
-  margin: 0 auto;
-  max-width: 600px;
-  color: #333;
-}
-
-.storybook-page h2 {
-  font-weight: 700;
-  font-size: 32px;
-  line-height: 1;
-  margin: 0 0 4px;
-  display: inline-block;
-  vertical-align: top;
-}
-
-.storybook-page p {
-  margin: 1em 0;
-}
-
-.storybook-page a {
-  text-decoration: none;
-  color: #1ea7fd;
-}
-
-.storybook-page ul {
-  padding-left: 30px;
-  margin: 1em 0;
-}
-
-.storybook-page li {
-  margin-bottom: 8px;
-}
-
-.storybook-page .tip {
-  display: inline-block;
-  border-radius: 1em;
-  font-size: 11px;
-  line-height: 12px;
-  font-weight: 700;
-  background: #e7fdd8;
-  color: #66bf3c;
-  padding: 4px 12px;
-  margin-right: 10px;
-  vertical-align: top;
-}
-
-.storybook-page .tip-wrapper {
-  font-size: 13px;
-  line-height: 20px;
-  margin-top: 40px;
-  margin-bottom: 40px;
-}
-
-.storybook-page .tip-wrapper svg {
-  display: inline-block;
-  height: 12px;
-  width: 12px;
-  margin-right: 4px;
-  vertical-align: top;
-  margin-top: 3px;
-}
-
-.storybook-page .tip-wrapper svg path {
-  fill: #1ea7fd;
-}

package/src/stories/Pages/Page/Page.jsx

@@ -1,69 +0,0 @@
-//this.GUI/src/stories/Profile/ProfilePageContext.jsx
-import React from 'react';
-import { Header } from '../../Molecules/Header/Header';
-import './Page.css';
-
-export const Page = () => {
-  const [user, setUser] = React.useState();
-
-  return (
-    <article>
-      <Header
-        user={user}
-        onLogin={() => setUser({ name: 'Jane Doe' })}
-        onLogout={() => setUser(undefined)}
-        onCreateAccount={() => setUser({ name: 'Jane Doe' })}
-      />
-
-      <section className="storybook-page">
-        <h2>Pages in Storybook</h2>
-        <p>
-          We recommend building UIs with a{' '}
-          <a href="https://componentdriven.org" target="_blank" rel="noopener noreferrer">
-            <strong>component-driven</strong>
-          </a>{' '}
-          process starting with atomic components and ending with pages.
-        </p>
-        <p>
-          Render pages with mock data. This makes it easy to build and review page states without
-          needing to navigate to them in your app. Here are some handy patterns for managing page
-          data in Storybook:
-        </p>
-        <ul>
-          <li>
-            Use a higher-level connected component. Storybook helps you compose such data from the
-            "args" of child component stories
-          </li>
-          <li>
-            Assemble data in the page component from your services. You can mock these services out
-            using Storybook.
-          </li>
-        </ul>
-        <p>
-          Get a guided tutorial on component-driven development at{' '}
-          <a href="https://storybook.js.org/tutorials/" target="_blank" rel="noopener noreferrer">
-            Storybook tutorials
-          </a>
-          . Read more in the{' '}
-          <a href="https://storybook.js.org/docs" target="_blank" rel="noopener noreferrer">
-            docs
-          </a>
-          .
-        </p>
-        <div className="tip-wrapper">
-          <span className="tip">Tip</span> Adjust the width of the canvas with the{' '}
-          <svg width="10" height="10" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
-            <g fill="none" fillRule="evenodd">
-              <path
-                d="M1.5 5.2h4.8c.3 0 .5.2.5.4v5.1c-.1.2-.3.3-.4.3H1.4a.5.5 0 01-.5-.4V5.7c0-.3.2-.5.5-.5zm0-2.1h6.9c.3 0 .5.2.5.4v7a.5.5 0 01-1 0V4H1.5a.5.5 0 010-1zm0-2.1h9c.3 0 .5.2.5.4v9.1a.5.5 0 01-1 0V2H1.5a.5.5 0 010-1zm4.3 5.2H2V10h3.8V6.2z"
-                id="a"
-                fill="#999"
-              />
-            </g>
-          </svg>
-          Viewports addon in the toolbar
-        </div>
-      </section>
-    </article>
-  );
-};

package/src/stories/Pages/Page/Page.stories.js

@@ -1,26 +0,0 @@
-import { within, userEvent, expect } from '@storybook/test';
-import { Page } from './Page';
-
-export default {
-  title: 'Pages/Default/Page',
-  component: Page,
-  parameters: {
-    // More on how to position stories at: https://storybook.js.org/docs/configure/story-layout
-    layout: 'fullscreen',
-  },
-};
-
-export const LoggedOut = {};
-// More on interaction testing: https://storybook.js.org/docs/writing-tests/interaction-testing
-export const LoggedIn = {
-  play: async ({ canvasElement }) => {
-    const canvas = within(canvasElement);
-    const loginButton = canvas.getByRole('button', { name: /Log in/i });
-    await expect(loginButton).toBeInTheDocument();
-    await userEvent.click(loginButton);
-    await expect(loginButton).not.toBeInTheDocument();
-    const logoutButton = canvas.getByRole('button', { name: /Log out/i });
-    await expect(logoutButton).toBeInTheDocument();
-  },
-};
-

package/src/stories/Pages/Page/Pages.js

@@ -1,31 +0,0 @@
-const Pages = {
-"Pages": {
-    "HomePage": [
-      { name: "HomePage", paths: { css: "styles/Pages/HomePage/HomePage.css", globalCss: "styles/global.css", jsx: "src/components/Pages/HomePage/HomePage.jsx", stories: "src/stories/Pages/HomePage/HomePage.stories.jsx" }},
-    ],
-    "AboutUsPage": [
-      { name: "AboutUsPage", paths: { css: "styles/Pages/AboutUsPage/AboutUsPage.css", globalCss: "styles/global.css", jsx: "src/components/Pages/AboutUsPage/AboutUsPage.jsx", stories: "src/stories/Pages/AboutUsPage/AboutUsPage.stories.jsx" }},
-    ],
-    "ContactUsPage": [
-      { name: "ContactUsPage", paths: { css: "styles/Pages/ContactUsPage/ContactUsPage.css", globalCss: "styles/global.css", jsx: "src/components/Pages/ContactUsPage/ContactUsPage.jsx", stories: "src/stories/Pages/ContactUsPage/ContactUsPage.stories.jsx" }},
-    ],
-    "UserProfilePage": [
-      { name: "UserProfilePage", paths: { css: "styles/Pages/UserProfilePage/UserProfilePage.css", globalCss: "styles/global.css", jsx: "src/components/Pages/UserProfilePage/UserProfilePage.jsx", stories: "src/stories/Pages/UserProfilePage/UserProfilePage.stories.jsx" }},
-    ],
-    "ProductDetailPage": [
-      { name: "ProductDetailPage", paths: { css: "styles/Pages/ProductDetailPage/ProductDetailPage.css", globalCss: "styles/global.css", jsx: "src/components/Pages/ProductDetailPage/ProductDetailPage.jsx", stories: "src/stories/Pages/ProductDetailPage/ProductDetailPage.stories.jsx" }},
-    ],
-    "CheckoutPage": [
-      { name: "CheckoutPage", paths: { css: "styles/Pages/CheckoutPage/CheckoutPage.css", globalCss: "styles/global.css", jsx: "src/components/Pages/CheckoutPage/CheckoutPage.jsx", stories: "src/stories/Pages/CheckoutPage/CheckoutPage.stories.jsx" }},
-    ],
-    "BlogPage": [
-      { name: "BlogPage", paths: { css: "styles/Pages/BlogPage/BlogPage.css", globalCss: "styles/global.css", jsx: "src/components/Pages/BlogPage/BlogPage.jsx", stories: "src/stories/Pages/BlogPage/BlogPage.stories.jsx" }},
-    ],
-    "AdminDashboard": [
-      { name: "AdminDashboard", paths: { css: "styles/Pages/AdminDashboard/AdminDashboard.css", globalCss: "styles/global.css", jsx: "src/components/Pages/AdminDashboard/AdminDashboard.jsx", stories: "src/stories/Pages/AdminDashboard/AdminDashboard.stories.jsx" }},
-    ],
-    "SearchResultsPage": [
-      { name: "SearchResultsPage", paths: { css: "styles/Pages/SearchResultsPage/SearchResultsPage.css", globalCss: "styles/global.css", jsx: "src/components/Pages/SearchResultsPage/SearchResultsPage.jsx", stories: "src/stories/Pages/SearchResultsPage/SearchResultsPage.stories.jsx" }},
-    ]
-  }
-}

package/src/stories/Templates/AdminDashboard/AdminDashboard.css

@@ -1,7 +0,0 @@
-
-.admindashboard {
-  padding: 16px;
-  border-radius: 8px;
-  background-color: #f0f0f0;
-  border: 1px solid #ddd;
-}

package/src/stories/Templates/AdminDashboard/AdminDashboard.jsx

@@ -1,24 +0,0 @@
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import './AdminDashboard.css';
-
-/**
- * AdminDashboard template component
- */
-export const AdminDashboard = ({ children, ...props }) => {
-  return (
-    <div className="admindashboard" {...props}>
-      {children}
-    </div>
-  );
-};
-
-AdminDashboard.propTypes = {
-  /**
-   * Children components to be rendered inside the template
-   */
-  children: PropTypes.node.isRequired,
-};
-
-export default AdminDashboard;

package/src/stories/Templates/AdminDashboard/AdminDashboard.stories.jsx

@@ -1,20 +0,0 @@
-
-import { AdminDashboard } from './AdminDashboard';
-
-// Storybook configuration for AdminDashboard template
-export default {
-  title: 'Templates/DashboardLayouts/AdminDashboard',
-  component: AdminDashboard,
-  parameters: {
-    layout: 'fullscreen',
-  },
-  argTypes: {
-    children: { control: 'text' },
-  },
-};
-
-export const Default = {
-  args: {
-    children: 'This is a default AdminDashboard template.',
-  },
-};