feat: readme documentation added. 1.0.0 🚀

README.md

@@ -1,4 +1,217 @@
 # Yefee-Ui
-Yefee-Ui is on demo version right now and don't have a website/documentation yet.
+Yefee-ui is a **react mini-library**, right now yefee-ui have just **6** components, but it's **lightweight**, **type safe** & **easy to use**!
 
-Documentation Website'll be ready soon.
+You can customize whatever you want with **className** or **style** props.
+
+## Components
+### Button
+#### Example:
+```
+import Button from "yefee-ui/src/lib/Button/Button";
+
+.
+.
+.
+
+<Button type="outlined" color="secondary>
+    Example!
+</Button>
+```
+#### Props:
+##### Children*
+##### Type (?)
+* normal (default)
+* rounded
+* outlined
+* rounded-outlined
+##### Color (?)
+* primary (default)
+* success
+* danger
+* secondary
+* white
+
+### Alert
+#### Example:
+```
+import Alert from "yefee-ui/src/lib/Alert/Alert";
+
+.
+.
+.
+
+<Alert color="secondary>
+    Example!
+</Alert>
+```
+#### Props:
+##### Width (?)
+##### Height (?)
+##### Children*
+##### Color (?)
+* primary (default)
+* success
+* danger
+* secondary
+* white
+
+### Dialog
+#### Example:
+```
+import Dialog from "yefee-ui/src/lib/Dialog/Dialog";
+
+.
+.
+.
+
+const [show, setShow] = useState(false);
+
+return(
+    <>
+        <Button type="outlined" color="white" 
+        onClick={()=>setShow(true)}>
+            Open the Dialog!
+        </Button>
+        
+        <Dialog color="white">
+            Example!
+            
+            <Button type="outlined" color="danger" onClick={()=>setShow(false)}>
+                Close it
+            </Button>      
+        </Dialog>
+    </>
+)
+```
+#### Props:
+##### Show*
+##### Children (?)
+##### Color (?)
+* dark (default)
+* white
+
+### Dropdown
+#### Example:
+```
+import DropdownBase from "yefee-ui/src/lib/Dropdown/Dropdown";
+import Dropdown from "yefee-ui/src/lib/Dropdown/Dropdown";
+import Button from "yefee-ui/src/lib/Button/Button";
+
+.
+.
+.
+
+const [show, setShow] = useState(false);
+const items = [
+    {
+        name: "Hi!"
+        change: "English"
+    },
+    {
+        name: "Bonjour!"
+        change: "French"
+    },
+    {
+        name: "Selam!"
+        change: "Turkish"
+    },
+    {
+        name: "Hola!"
+        change: "Spanish"
+    },
+]
+
+const [valueOfDropdown, setValueOfDropdown] = useState("Please pick an language");
+
+return(
+    <>
+        <DropdownBase
+            style={{
+                width: "320px",
+                height: "160px",
+                borderRadius: "32px",
+                padding: "16px",
+                fontSize:"16px"
+            }} 
+            {/* style & classname are optional */}
+        >
+            <Button onClick={()=>setShow(!show)}>
+                {valueOfDropdown}
+            </Button>
+            
+            <Dropdown closer={()=>setShow(false)} setter={(change: any)=>setValueOfDropdown(change)} 
+            items={items} show={show} color="white" />
+        </DropdownBase>
+    </>
+)
+```
+#### Props:
+##### Show*
+##### Items: ``` [{ name: string, change: string ] ```
+// the change in the object is change of the state when clicked to the dropdown item.
+##### Setter: state setter
+##### Close: Dropdown's closer function ex: ```() => setShow(false)```
+##### Color (?)
+* dark (default)
+* white
+
+### Input
+> It have same props with input.
+
+#### Example:
+```
+import Input from "yefee-ui/src/lib/Input/Input";
+
+.
+.
+.
+
+<Input placeholder="hey, type something!" />
+```
+
+### Tooltip
+#### Example:
+```
+import TooltipBase from "yefee-ui/src/lib/Tooltip/Tooltip";
+import Tooltip from "yefee-ui/src/lib/Tooltip/Tooltip";
+import Button from "yefee-ui/src/lib/Button/Button";
+.
+.
+.
+
+const [show, setShow] = useState(false);
+
+const [valueOfDropdown, setValueOfDropdown] = useState("Please pick an language");
+
+return(
+    <>
+        <TooltipBase
+            style={{
+                width: "320px",
+                height: "160px",
+                borderRadius: "32px",
+                padding: "16px",
+                fontSize:"16px"
+            }} 
+            {/* style & classname are optional */}
+        >
+            <Button onClick={()=>{setShow(true)} >
+                Open Tooltip!
+            </Button>
+            
+            <Tooltip position="left" show={show} color="white" />
+        </TooltipBase>
+    </>
+)
+```
+#### Props:
+##### Show*
+##### Children*
+##### Position (?)
+* bottom (default)
+* left 
+* right
+* top
+##### Color (?)
+* dark (default)
+* white

package.json

@@ -1,6 +1,6 @@
 {
   "name": "yefee-ui",
-  "version": "0.1.2",
+  "version": "1.0.0",
   "author": "yefee",
   "license": "ISC",
   "repository": {
@@ -90,4 +90,4 @@
     "jsx",
     "node"
   ]
-}
+}

tsconfig.json

@@ -6,7 +6,7 @@
     // "incremental": true,                   /* Enable incremental compilation */
     "target": "es2016",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
     "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
-    // "lib": [],                             /* Specify library files to be included in the compilation. */
+    "lib": ["DOM", "ES6", "DOM.Iterable", "ScriptHost", "ES2016.Array.Include"],                                        /* Specify a set of bundled library declaration files that describe the target runtime environment. */    /* Specify library files to be included in the compilation. */
     // "allowJs": true,                       /* Allow javascript files to be compiled. */
     // "checkJs": true,                       /* Report errors in .js files. */
     "jsx": "react",                     /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
@@ -66,4 +66,4 @@
     "skipLibCheck": false,                     /* Skip type checking of declaration files. */
     "forceConsistentCasingInFileNames": true  /* Disallow inconsistently-cased references to the same file. */
   }
-}
+}