CUI-01: Adjust stories.

Author: Juan Felipe Rada

src/Introduction.mdx

@@ -1,6 +1,6 @@
 # Welcome
 
-Cunctum UI is the web implementation of the [Cunctae](https://cunctae.com/) Design System. 
+Cunctum UI is the web implementation of the [Cunctae](https://cunctae.com/) Design System.
 Cunctae originated as a personal project aimed at encapsulating all the elements I wanted to include. The name "Cunctae" comes from Latin, meaning "everything," and when combined with "Cunctum," it signifies "all together," reflecting one of the primary purposes of this project.
 
 This project has been developed using TypeScript and HTML, leveraging Vanilla JavaScript as the framework and CSS for styling all components. Cunctum UI aims to provide a cohesive and flexible design system that can be easily integrated into various web applications.
@@ -11,23 +11,19 @@ This project has been developed using TypeScript and HTML, leveraging Vanilla Ja
 # Contributing
 
 We welcome contributions! If you encounter any issues, have suggestions for improvements, or would like to propose changes, please feel free to file a bug report, suggest a change, or open a pull request.
-
 [Contribute](Contributing/Overview/Docs)
 
 # Design Tokens
 
 Explore our foundational elements, including colors, spacing, and typography, which are essential for maintaining consistency across the design system.
 
-*Work in progress*
-
 ## Code of Conduct
 
 We strive to foster an inclusive and friendly community around our open-source efforts. Like all Cunctae open-source projects, this project adheres to the Contributor Covenant Code of Conduct. Please [read it and follow it](https://github.com/Cunctae/cunctum-ui/blob/main/CODE_OF_CONDUCT.md).
 
 If you feel that another community member has violated our Code of Conduct or if you are experiencing difficulties participating in our community due to another individual's behavior, please reach out to our maintainers. We are committed to enforcing the Code of Conduct.
 
-## About SumUp
+## About Cunctae
 
 [Cunctae](https://cunctae.com/) is a project dedicated to reimagining the boundaries of the creative process. We embrace experimentation and learning by doing. We encourage you to contribute by adding new features, enhancements, and fixing bugs.
 
-# End of Selection

src/stories/icon/icon.paths.ts

@@ -1,4 +1,5 @@
 export const coordinatesPaths = {
     'arrow-left': 'M6.85355 3.14645C7.04882 3.34171 7.04882 3.65829 6.85355 3.85355L3.70711 7H12.5C12.7761 7 13 7.22386 13 7.5C13 7.77614 12.7761 8 12.5 8H3.70711L6.85355 11.1464C7.04882 11.3417 7.04882 11.6583 6.85355 11.8536C6.65829 12.0488 6.34171 12.0488 6.14645 11.8536L2.14645 7.85355C1.95118 7.65829 1.95118 7.34171 2.14645 7.14645L6.14645 3.14645C6.34171 2.95118 6.65829 2.95118 6.85355 3.14645Z',
-    'x': 'M12.8536 2.85355C13.0488 2.65829 13.0488 2.34171 12.8536 2.14645C12.6583 1.95118 12.3417 1.95118 12.1464 2.14645L7.5 6.79289L2.85355 2.14645C2.65829 1.95118 2.34171 1.95118 2.14645 2.14645C1.95118 2.34171 1.95118 2.65829 2.14645 2.85355L6.79289 7.5L2.14645 12.1464C1.95118 12.3417 1.95118 12.6583 2.14645 12.8536C2.34171 13.0488 2.65829 13.0488 2.85355 12.8536L7.5 8.20711L12.1464 12.8536C12.3417 13.0488 12.6583 13.0488 12.8536 12.8536C13.0488 12.6583 13.0488 12.3417 12.8536 12.1464L8.20711 7.5L12.8536 2.85355Z'
+    'x': 'M12.8536 2.85355C13.0488 2.65829 13.0488 2.34171 12.8536 2.14645C12.6583 1.95118 12.3417 1.95118 12.1464 2.14645L7.5 6.79289L2.85355 2.14645C2.65829 1.95118 2.34171 1.95118 2.14645 2.14645C1.95118 2.34171 1.95118 2.65829 2.14645 2.85355L6.79289 7.5L2.14645 12.1464C1.95118 12.3417 1.95118 12.6583 2.14645 12.8536C2.34171 13.0488 2.65829 13.0488 2.85355 12.8536L7.5 8.20711L12.1464 12.8536C12.3417 13.0488 12.6583 13.0488 12.8536 12.8536C13.0488 12.6583 13.0488 12.3417 12.8536 12.1464L8.20711 7.5L12.8536 2.85355Z',
+    'hamburger': 'M1.5 3C1.22386 3 1 3.22386 1 3.5C1 3.77614 1.22386 4 1.5 4H13.5C13.7761 4 14 3.77614 14 3.5C14 3.22386 13.7761 3 13.5 3H1.5ZM1 7.5C1 7.22386 1.22386 7 1.5 7H13.5C13.7761 7 14 7.22386 14 7.5C14 7.77614 13.7761 8 13.5 8H1.5C1.22386 8 1 7.77614 1 7.5ZM1 11.5C1 11.2239 1.22386 11 1.5 11H13.5C13.7761 11 14 11.2239 14 11.5C14 11.7761 13.7761 12 13.5 12H1.5C1.22386 12 1 11.7761 1 11.5Z'
 }

src/stories/icon/icon.stories.ts

@@ -1,5 +1,6 @@
 import { Meta, StoryObj } from "@storybook/html";
 import { IconProps, createIcon } from "./icon";
+import { coordinatesPaths } from "./icon.paths";
 
 const meta: Meta<IconProps> = {
   title: "Atoms/Icon",
@@ -26,5 +27,7 @@ export const Default: Story = {
 };
 
 Default.args = {
-
+  boxHeight: '15',
+  boxWidth: '15',
+  coordinates: coordinatesPaths['hamburger']
 };

src/stories/progress/progress.stories.ts

@@ -9,7 +9,7 @@ const meta: Meta<ProgressProps> = {
             decorator.appendChild(story() as Node);
             return decorator;
         },
-    ],
+    ]
 };
 export default meta;
 

src/stories/separator/separator.css

@@ -6,13 +6,13 @@
 }
 
 .separator--vertical {
-  height: 1px;
+  height: 2px;
   width: 100%;
   margin: 20px 0;
 
 }
 .separator--horizontal {
   height: 100px;
-  width: 1px;
+  width: 2px;
   margin: 0 20px;
 }

src/stories/separator/separator.stories.ts

@@ -10,6 +10,14 @@ const meta: Meta<SeparatorProps> = {
       return decorator;
     },
   ],
+  argTypes: {
+    orientation: {
+      control: "inline-radio",
+      description: "Ortientation",
+      options: ["vertical", "horizontal" ],
+      type: 'string',
+    },
+  },
 };
 export default meta;