@zesty-io/material 0.0.2-0 → 0.0.2

package/.storybook/main.js

@@ -0,0 +1,12 @@
+module.exports = {
+  "stories": [
+    "../src/**/*.stories.mdx",
+    "../src/**/*.stories.@(js|jsx|ts|tsx)"
+  ],
+  "addons": [
+    "@storybook/addon-links",
+    "@storybook/addon-essentials",
+    "@storybook/addon-interactions"
+  ],
+  "framework": "@storybook/react"
+}

package/.storybook/preview.js

@@ -0,0 +1,9 @@
+export const parameters = {
+  actions: { argTypesRegex: "^on[A-Z].*" },
+  controls: {
+    matchers: {
+      color: /(background|color)$/i,
+      date: /Date$/,
+    },
+  },
+}

package/es/stories/Theme.stories.d.ts

@@ -0,0 +1,4 @@
+import { Story, Meta } from '@storybook/react/types-6-0';
+declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
+export default _default;
+export declare const Default: Story<import("@storybook/react/types-6-0").Args>;

package/es/stories/Theme.stories.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import ReactJson from 'react-json-view';
+import theme from '../theme';
+export default {
+    title: 'Theme',
+};
+const Template = (args) => {
+    return (_jsx(ReactJson, { src: theme }));
+};
+export const Default = Template.bind({});

package/es/theme/index.d.ts

@@ -1,3 +1,3 @@
 import { Theme } from '@mui/material/styles';
-declare const theme: Theme;
+declare let theme: Theme;
 export default theme;

package/es/theme/index.js

@@ -1,8 +1,23 @@
 import palette from './palette';
 import typography from './typography';
 import { createTheme } from '@mui/material/styles';
-const theme = createTheme({
+let theme = createTheme({
     palette,
     typography,
 });
+theme = createTheme(theme, {
+    MuiTooltip: {
+        styleOverrides: {
+            tooltip: {
+                color: theme.palette.primary.contrastText,
+                backgroundColor: theme.palette.primary.main,
+                fontSize: "14px",
+                lineHeight: "20px",
+            },
+            arrow: {
+                color: theme.palette.primary.main,
+            }
+        }
+    }
+});
 export default theme;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zesty-io/material",
-  "version": "0.0.2-0",
+  "version": "0.0.2",
   "description": "Contains custom components which are in addition to the @mui design-system",
   "author": "Zesty.io",
   "license": "MIT",
@@ -11,7 +11,7 @@
   "bugs": {
     "url": "https://github.com/zesty-io/material/issues"
   },
-  "homepage": "https://github.com/zesty-io/material#readme",
+  "homepage": "https://zesty-io.github.io/material",
   "main": "es/index.js",
   "module": "es/index.js",
   "types": "es/index.d.ts",
@@ -21,7 +21,10 @@
     "release": "npm run build && npm publish --access public",
     "release:alpha": "npm run build && npm publish --access public --tag alpha",
     "postrelease": "rm -rf /es",
-    "test": "echo 'add tests'"
+    "deploy": "npm run build-storybook && gh-pages -d storybook-static",
+    "test": "echo 'add tests'",
+    "storybook": "start-storybook -p 6006",
+    "build-storybook": "build-storybook"
   },
   "dependencies": {
     "@emotion/react": "^11.9.0",
@@ -30,6 +33,18 @@
     "@mui/material": "^5.6.4"
   },
   "devDependencies": {
+    "@babel/core": "^7.17.10",
+    "@storybook/addon-actions": "^6.4.22",
+    "@storybook/addon-essentials": "^6.4.22",
+    "@storybook/addon-interactions": "^6.4.22",
+    "@storybook/addon-links": "^6.4.22",
+    "@storybook/react": "^6.4.22",
+    "@storybook/testing-library": "0.0.11",
+    "babel-loader": "^8.2.5",
+    "gh-pages": "^3.2.3",
+    "react": "^18.1.0",
+    "react-dom": "^18.1.0",
+    "react-json-view": "^1.21.3",
     "typescript": "^4.6.3"
   }
 }

package/src/stories/Theme.stories.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import ReactJson from 'react-json-view'
+import { Story, Meta } from '@storybook/react/types-6-0';
+import theme from '../theme';
+
+export default {
+  title: 'Theme',
+} as Meta;
+
+const Template: Story = (args) => {
+  return (
+    <ReactJson src={theme} />
+  );
+};
+
+export const Default = Template.bind({});

package/src/theme/index.ts

@@ -2,9 +2,24 @@ import palette from './palette';
 import typography from './typography';
 import { createTheme, Theme } from '@mui/material/styles';
 
-const theme: Theme = createTheme({
+let theme: Theme = createTheme({
   palette,
   typography,
 });
 
+theme = createTheme(theme, {
+  MuiTooltip: {
+      styleOverrides: {
+          tooltip: {
+              color: theme.palette.primary.contrastText,
+              backgroundColor: theme.palette.primary.main,
+              fontSize: "14px",
+              lineHeight: "20px",
+          },
+          arrow: {
+              color: theme.palette.primary.main,
+          }
+      }
+  }
+})
 export default theme;