feat:first version

.editorconfig

@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

.eslintrc.js

@@ -0,0 +1,23 @@
+module.exports = {
+  env: {
+    browser: true,
+    es2021: true,
+  },
+  extends: ['eslint:recommended', 'plugin:react/recommended', 'plugin:@typescript-eslint/recommended'],
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    ecmaFeatures: {
+      jsx: true,
+    },
+    ecmaVersion: 12,
+    sourceType: 'module',
+  },
+  plugins: ['react', '@typescript-eslint'],
+  rules: {
+    'no-empty-function': 'off',
+    '@typescript-eslint/no-empty-function': ['error'],
+    'import/prefer-default-export': 'off',
+    'react/prop-types': 'off',
+    '@typescript-eslint/ban-types': 'off',
+  },
+};

.github/workflows/release.yml

@@ -0,0 +1,47 @@
+# Name for the github action
+name: Release
+
+# Trigger this action when we push to master or merge a pull-request to masteron:
+on:
+  push:
+    branches:
+      - master
+
+# runs the jobs
+jobs:
+  release:
+    name: Release
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+
+      - name: Setup node
+        uses: actions/setup-node@v1
+        with:
+          node-version: '12.x'
+
+      - name: Restore ~/.npm cache
+        uses: actions/cache@v2
+        with:
+          path: ~/.npm
+          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
+          restore-keys: |
+            ${{ runner.os }}-node-
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build
+        run: npm run build
+
+      - name: Release
+        run: npx semantic-release
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+
+
+
+
+

.github/workflows/test.yml

@@ -0,0 +1,39 @@
+name: Build & Test
+
+on:
+  push:
+    branches:
+      - master
+  pull_request:
+    branches:
+      - master
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    name: Build & Lint
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+
+      - name: Setup node
+        uses: actions/setup-node@v1
+        with:
+          node-version: '12.x'
+
+      - name: Restore ~/.npm cache
+        uses: actions/cache@v2
+        with:
+          path: ~/.npm
+          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
+          restore-keys: |
+            ${{ runner.os }}-node-
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run build
+        run: npm run build
+
+      - name: Run lint
+        run: npm run lint

.gitignore

@@ -0,0 +1,34 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+
+# node.js
+#
+node_modules
+node_modules/
+npm-debug.log
+yarn-debug.log
+yarn-error.log
+
+dist
+
+.idea
+
+.npmrc

.prettierrc.json

@@ -0,0 +1,9 @@
+{
+  "bracketSpacing": true,
+  "singleQuote": true,
+  "trailingComma": "all",
+  "arrowParens": "avoid",
+  "printWidth": 200,
+  "endOfLine": "auto",
+  "proseWrap": "preserve"
+}

.travis.yml

@@ -0,0 +1,4 @@
+language: node_js
+node_js:
+  - 12
+  - 10

README.md

@@ -0,0 +1,102 @@
+# material-ui-dialog-alert
+
+> Made with create-react-library
+
+[![NPM](https://img.shields.io/npm/v/material-ui-dialog-alert.svg)](https://www.npmjs.com/package/material-ui-dialog-alert) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
+
+## Install
+
+#### yarn
+```bash
+yarn add material-ui-dialog-alert
+```
+
+#### npm
+```bash
+npm install --save material-ui-dialog-alert
+```
+
+## Usage
+
+```tsx
+const Child = () => {
+  const clickHandler = () => {
+    DialogAlert.show({
+      closeOnOverlayTap: false,
+      dialogProps: undefined, // dialogProps (optional)
+      title: 'My title', // string (optional),
+      description: 'my description', // string or JSX.Element (optional),
+      buttons: [
+        {
+          title: 'Cancel',
+          buttonProps: { color: 'secondary' },
+          onClick: () => {
+            console.log('callback button Cancel');
+            DialogAlert.hide();
+          },
+        },
+        {
+          title: 'Ok',
+          buttonProps: { color: 'primary' },
+          onClick: async () => {
+            alert('callback button Ok');
+            DialogAlert.hide();
+          },
+        },
+      ],
+      onClose: () => console.log('dialog alert is close'), // (optional)
+    });
+  };
+  return <button onClick={clickHandler}>Test My</button>;
+};
+
+const Parent = () => {
+  const [dialogProps] = useState<Partial<DialogProps>>({ maxWidth: 'xs' }); // (optional)
+
+  return (
+    <DialogAlertRoot dialogProps={dialogProps} closeOnOverlayTap={false}>
+      <Child />
+    </DialogAlertRoot>
+  );
+};
+
+export default Parent;
+```
+## Usage
+
+### Root Component
+A React node that will be most likely wrapping your whole app.
+
+| Name                | Description                                         | Require  | Default  | Type                              |
+| ------------------- | --------------------------------------------------- | -------- | -------- | --------------------------------- |
+|dialogProps|  |  |  | Partial\<DialogProps> |
+|closeOnOverlayTap|allow close if click in overlay| |  false | bool |
+
+
+### Dialog Box Component
+| Name                | Description                                         | Require  | Default  | Type                              |
+| ------------------- | --------------------------------------------------- | -------- | -------- | --------------------------------- |
+| title               | The title text                                      |   false  |          | String                            |
+| description         | The description text  or   JEX.Element              |   false  |          | String                            |
+| buttons             | buttons                                             |   true   |          | [IButton] OR [IButton, IButton]    |
+|closeOnOverlayTap|allow close if click in overlay| |  false | bool |
+| dialogProps             |                                              |      |          | Partial\<DialogProps>    |
+
+
+```ts
+
+type IButton = { buttonProps?: ButtonProps; title: string; onClick: () => void };
+
+export type IConfig = {
+  closeOnOverlayTap?: boolean;
+  dialogProps?: Partial<DialogProps>;
+  title: string;
+  description: string | ReactElement;
+  buttons: [IButton] | [IButton, IButton];
+};
+```
+
+
+## License
+
+MIT © [CodingByJerez](https://github.com/CodingByJerez) Rodolphe Jerez

example/README.md

@@ -0,0 +1,5 @@
+This example was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
+
+It is linked to the material-ui-dialog-alert package in the parent directory for development purposes.
+
+You can run `yarn install` and then `yarn start` to test your package.

example/build/manifest.json

@@ -0,0 +1,15 @@
+{
+  "short_name": "material-ui-dialog-alert",
+  "name": "material-ui-dialog-alert",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

example/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "material-ui-dialog-alert-example",
+  "homepage": ".",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "start": "node ../node_modules/react-scripts/bin/react-scripts.js start",
+    "build": "node ../node_modules/react-scripts/bin/react-scripts.js build",
+    "eject": "node ../node_modules/react-scripts/bin/react-scripts.js eject"
+  },
+  "dependencies": {
+    "@material-ui/core": "^4.12.0",
+    "@types/jest": "link:../node_modules/@types/jest",
+    "@types/node": "link:../node_modules/@types/node",
+    "@types/react": "link:../node_modules/@types/react",
+    "@types/react-dom": "link:../node_modules/@types/react-dom",
+    "material-ui-dialog-alert": "link:..",
+    "react": "link:../node_modules/react",
+    "react-dom": "link:../node_modules/react-dom",
+    "react-scripts": "link:../node_modules/react-scripts",
+    "typescript": "link:../node_modules/typescript"
+  },
+  "devDependencies": {
+    "@babel/plugin-syntax-object-rest-spread": "^7.8.3"
+  },
+  "eslintConfig": {
+    "extends": "react-app"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

example/public/index.html

@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1, shrink-to-fit=no"
+    />
+    <meta name="theme-color" content="#000000" />
+
+    <!--
+      manifest.json provides metadata used when your web app is added to the
+      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
+    -->
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+
+    <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+
+      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+      work correctly both with client-side routing and a non-root public URL.
+      Learn how to configure a non-root public URL by running `npm run build`.
+    -->
+    <title>material-ui-dialog-alert</title>
+  </head>
+
+  <body>
+    <noscript>
+      You need to enable JavaScript to run this app.
+    </noscript>
+
+    <div id="root"></div>
+
+    <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `npm start` or `yarn start`.
+      To create a production bundle, use `npm run build` or `yarn build`.
+    -->
+  </body>
+</html>