feat:delete useless files && fix View types issue

doniaskima · Dec 8, 2023 · 5ba726b · 5ba726b
1 parent 95c12c0
commit 5ba726b
Show file tree

Hide file tree

Showing 13 changed files with 73 additions and 395 deletions.
diff --git a/.babelrc b/.babelrc
diff --git a/exemple/src/components/Card/index.tsx b/exemple/src/components/Card/index.tsx
@@ -6,7 +6,7 @@ import { Button } from 'react-craftify-core';
 const CardComponent = () => {
   return (
     <div>
-      <Card className="radius-md shadow divide-y color-slate">
+      {/* <Card className="radius-md shadow divide-y color-slate">
         <Card.Header className="size-lg"  >
           Standard Plan
         </Card.Header>
@@ -39,7 +39,40 @@ const CardComponent = () => {
  
   </Card>
       </div>
+      <div>
+      <Card bordered={true}>
+    // ...
+  </Card> */}
+
+  {/* <Card bordered={false}>
+    Lorem ipsum dolor sit amet consectetur adipisicing elit. Excepturi deleniti, quos sunt non, enim accusamus quia ratione optio facilis sequi facere ab ipsa, eum nulla consequatur labore illo? Alias officia reiciendis eum architecto fuga quibusdam exercitationem dolor sapiente, nostrum perspiciatis placeat porro voluptatibus magni veritatis magnam consequuntur earum ex necessitatibus minima nam facilis ratione eius! Quidem placeat aut, ipsam aliquam natus culpa ipsa ducimus corrupti. Fugiat libero nemo quisquam molestiae necessitatibus earum itaque veritatis magnam officiis accusantium totam expedita voluptatum mollitia autem optio debitis, dolor corrupti voluptate veniam assumenda. Illum.
+  </Card> */}
+
+  <Card shadow="lg">
+   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Atque praesentium omnis ipsam, maxime consectetur magnam enim cum veniam hic odit tempore delectus sint? Perferendis, sint hic! Architecto, nisi. Minima, accusantium?
+  </Card>
+
+
+{/* 
+  <Card shadow="sm">
+    // ...
+  </Card>
+
+  <Card shadow="base">
+    // ...
+  </Card>
+
+  <Card shadow="md">
+    // ...
+  </Card>
+
+  <Card shadow="lg">
+    // ...
+  </Card>
 
+  <Card shadow="xl">
+    // ...
+  </Card> */}
     </div>
   );
 };

diff --git a/lerna.json b/lerna.json
diff --git a/packages/components/ThemeProvider/index.tsx b/packages/components/ThemeProvider/index.tsx
diff --git a/packages/components/TopLoader/TopLoader.scss b/packages/components/TopLoader/TopLoader.scss
diff --git a/packages/components/TopLoader/TopLoader.tsx b/packages/components/TopLoader/TopLoader.tsx
diff --git a/packages/components/View/View.tsx b/packages/components/View/View.tsx
@@ -78,51 +78,24 @@ const Quote = styled.span`
   margin-left: 0.125rem;
 `;
 
-interface ViewProps {
+interface EnhancedViewProps {
   prop: string;
   value?: string;
-  direction?: 'row' | 'column';
-  justify?: 'start' | 'evenly';
-  children: ReactNode;
+  children: React.ReactNode;
 }
+
 
-export const View: React.FC<ViewProps> = ({
-  prop,
-  value = '',
-  direction = 'row',
-  justify = 'evenly',
-  children,
-}) => {
-  return (
-    <Container>
-      <Header>
-        <PropName>{prop}</PropName>
-        {value && (
-          <BadgeWrapper>
-            <Equals>=&quot;</Equals>
-            <Badge>{value}</Badge>
-            <Quote>&quot;</Quote>
-          </BadgeWrapper>
-        )}
-      </Header>
-      <ContentContainer>
-        {children}
-      </ContentContainer>
-    </Container>
-  );
-};
-
-interface EnhancedViewProps {
-  prop: string;
-  value?: string;
-  children: ReactNode;
+function isChildrenObject(obj: any): obj is { [key: string]: React.ReactNode } {
+  return typeof obj === 'object' && obj !== null && !React.isValidElement(obj);
 }
 
-export const EnhancedView: React.FC<EnhancedViewProps> = ({
+export const View: React.FC<EnhancedViewProps> = ({
   prop,
   value = '',
   children,
 }) => {
+  const childrenObject = isChildrenObject(children) ? children : {};
+
   return (
     <Container>
       <Header>
@@ -138,26 +111,27 @@ export const EnhancedView: React.FC<EnhancedViewProps> = ({
       <ContentContainer>
         <SubContainer>
           <PropTitle>Props</PropTitle>
-          {Object.keys(children).map((propName) => (
+          {Object.keys(childrenObject).map((propName) => (
             <PropValue key={propName}>
               {propName}
-              {typeof children[propName] === 'string' && (
-                <Badge>{children[propName]}</Badge>
+              {typeof childrenObject[propName] === 'string' && (
+                <Badge>{childrenObject[propName]}</Badge>
               )}
             </PropValue>
           ))}
-          {Object.keys(children).length === 0 && (
+          {Object.keys(childrenObject).length === 0 && (
             <PropValue>No properties selected</PropValue>
           )}
         </SubContainer>
-        <Grid>
-          {children}
-        </Grid>
+        <Grid>{children}</Grid>
       </ContentContainer>
     </Container>
   );
 };
 
+
+
+
 interface ViewGroupProps {
   children: ReactNode;
   direction?: 'column' | 'row';

diff --git a/packages/components/package-lock.json b/packages/components/package-lock.json
diff --git a/packages/components/package.json b/packages/components/package.json
@@ -53,6 +53,7 @@
     "@types/jest-axe": "^3.5.5",
     "@types/react": "^18.2.20",
     "@types/react-transition-group": "^4.4.6",
+    "@types/styled-components": "^5.1.34",
     "@types/uuid": "^9.0.3",
     "@typescript-eslint/eslint-plugin": "^6.4.0",
     "@typescript-eslint/parser": "^6.4.0",