matsuri-ui 9.7.2-alpha.0

package/dist/types/theme.d.ts

@@ -0,0 +1,385 @@
+import { DeepPartial } from "./@typings/DeepPartial";
+import React from "react";
+export interface CustomTheme {
+}
+export interface Theme {
+    palette: {
+        intentions: {
+            primary: {
+                light: string;
+                main: string;
+                dark: string;
+                contrastText: string;
+            };
+            secondary: {
+                light: string;
+                main: string;
+                dark: string;
+                contrastText: string;
+            };
+            accent: {
+                light: string;
+                main: string;
+                dark: string;
+                contrastText: string;
+            };
+            success: {
+                light: string;
+                main: string;
+                dark: string;
+                contrastText: string;
+            };
+            info: {
+                light: string;
+                main: string;
+                dark: string;
+                contrastText: string;
+            };
+            warning: {
+                light: string;
+                main: string;
+                dark: string;
+                contrastText: string;
+            };
+            error: {
+                light: string;
+                main: string;
+                dark: string;
+                contrastText: string;
+            };
+        };
+        gray: {
+            50: string;
+            100: string;
+            200: string;
+            300: string;
+            400: string;
+            500: string;
+            600: string;
+            700: string;
+            800: string;
+            900: string;
+        };
+        text: {
+            primary: string;
+            secondary: string;
+            disabled: string;
+            hint: string;
+        };
+        background: {
+            paper: string;
+            overlay: string;
+            default: string;
+        };
+        action: {
+            active: string;
+            hover: string;
+            hoverOpacity: number;
+            selected: string;
+            disabled: string;
+            disabledBackground: string;
+        };
+    };
+    spacing: 7;
+    breakpoints: {
+        xs: 0;
+        sm: 600;
+        md: 960;
+        lg: 1280;
+        xl: 1920;
+    };
+    typography: {
+        h1: {
+            fontFamily: string;
+            fontWeight: number;
+            fontSize: number;
+            lineHeight: number;
+            letterSpacing: string;
+            fontSmoothing: string;
+        };
+        h2: {
+            fontFamily: string;
+            fontWeight: number;
+            fontSize: number;
+            lineHeight: number;
+            letterSpacing: string;
+            fontSmoothing: string;
+        };
+        h3: {
+            fontFamily: string;
+            fontWeight: number;
+            fontSize: number;
+            lineHeight: number;
+            letterSpacing: string;
+            fontSmoothing: string;
+        };
+        h4: {
+            fontFamily: string;
+            fontWeight: number;
+            fontSize: number;
+            lineHeight: number;
+            letterSpacing: string;
+            fontSmoothing: string;
+        };
+        body: {
+            fontFamily: string;
+            fontWeight: number;
+            fontSize: number;
+            lineHeight: number;
+            letterSpacing: string;
+            fontSmoothing: string;
+        };
+        button: {
+            fontFamily: string;
+            fontWeight: number;
+            fontSize: number;
+            lineHeight: number;
+            letterSpacing: string;
+            fontSmoothing: string;
+        };
+        caption: {
+            fontFamily: string;
+            fontWeight: number;
+            fontSize: number;
+            lineHeight: number;
+            letterSpacing: string;
+            fontSmoothing: string;
+        };
+    };
+    transitions: {
+        easing: {
+            easeInOut: string;
+            easeOut: string;
+            easeIn: string;
+            sharp: string;
+        };
+        duration: {
+            shortest: string;
+            shorter: string;
+            short: string;
+            standard: string;
+            complex: string;
+            enteringScreen: string;
+            leavingScreen: string;
+        };
+    };
+    shadows: string[];
+    zIndex: {
+        mobileStepper: number;
+        speedDial: number;
+        appBar: number;
+        drawer: number;
+        modal: number;
+        snackbar: number;
+        tooltip: number;
+    };
+}
+export declare const defaultTheme: Theme;
+export declare type DeepPartialTheme = DeepPartial<Theme & CustomTheme>;
+export interface ThemeProps {
+    theme: Theme;
+}
+export declare type Size = "small" | "medium" | "large";
+export interface SizeProps {
+    /**
+     * 大きさを指定します。
+     *
+     * @default medium
+     */
+    size?: Size;
+}
+declare type PickInternsionsKey<B> = B extends {
+    palette: {
+        intentions: infer D;
+    };
+} ? keyof D : never;
+export declare type Color = keyof Theme["palette"]["intentions"] | PickInternsionsKey<CustomTheme>;
+export interface ColorProps {
+    /**
+     * 色を指定します。
+     *
+     * @default default
+     */
+    color: Color | "default";
+}
+export interface PartialColorProps {
+    /**
+     * 色を指定します。
+     *
+     * @default default
+     */
+    color?: Color | "default";
+}
+export interface SpacingProps {
+    /**
+     *
+     * @default undefined
+     */
+    spacing?: number | string;
+}
+export declare const ThemeProvider: React.FC<{
+    theme: DeepPartial<Theme & CustomTheme>;
+}>;
+export declare const useTheme: () => Theme & CustomTheme;
+export declare const usePalette: () => {
+    intentions: {
+        primary: {
+            light: string;
+            main: string;
+            dark: string;
+            contrastText: string;
+        };
+        secondary: {
+            light: string;
+            main: string;
+            dark: string;
+            contrastText: string;
+        };
+        accent: {
+            light: string;
+            main: string;
+            dark: string;
+            contrastText: string;
+        };
+        success: {
+            light: string;
+            main: string;
+            dark: string;
+            contrastText: string;
+        };
+        info: {
+            light: string;
+            main: string;
+            dark: string;
+            contrastText: string;
+        };
+        warning: {
+            light: string;
+            main: string;
+            dark: string;
+            contrastText: string;
+        };
+        error: {
+            light: string;
+            main: string;
+            dark: string;
+            contrastText: string;
+        };
+    };
+    gray: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    text: {
+        primary: string;
+        secondary: string;
+        disabled: string;
+        hint: string;
+    };
+    background: {
+        paper: string;
+        overlay: string;
+        default: string;
+    };
+    action: {
+        active: string;
+        hover: string;
+        hoverOpacity: number;
+        selected: string;
+        disabled: string;
+        disabledBackground: string;
+    };
+};
+export declare const useSpacing: () => 7;
+export declare const useTypography: () => {
+    h1: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: number;
+        lineHeight: number;
+        letterSpacing: string;
+        fontSmoothing: string;
+    };
+    h2: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: number;
+        lineHeight: number;
+        letterSpacing: string;
+        fontSmoothing: string;
+    };
+    h3: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: number;
+        lineHeight: number;
+        letterSpacing: string;
+        fontSmoothing: string;
+    };
+    h4: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: number;
+        lineHeight: number;
+        letterSpacing: string;
+        fontSmoothing: string;
+    };
+    body: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: number;
+        lineHeight: number;
+        letterSpacing: string;
+        fontSmoothing: string;
+    };
+    button: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: number;
+        lineHeight: number;
+        letterSpacing: string;
+        fontSmoothing: string;
+    };
+    caption: {
+        fontFamily: string;
+        fontWeight: number;
+        fontSize: number;
+        lineHeight: number;
+        letterSpacing: string;
+        fontSmoothing: string;
+    };
+};
+export declare const useBreakpoints: () => {
+    xs: 0;
+    sm: 600;
+    md: 960;
+    lg: 1280;
+    xl: 1920;
+};
+export declare const useTransitions: () => {
+    easing: {
+        easeInOut: string;
+        easeOut: string;
+        easeIn: string;
+        sharp: string;
+    };
+    duration: {
+        shortest: string;
+        shorter: string;
+        short: string;
+        standard: string;
+        complex: string;
+        enteringScreen: string;
+        leavingScreen: string;
+    };
+};
+export declare const useShadows: () => string[];
+export {};

package/package.json

@@ -0,0 +1,135 @@
+{
+    "name": "matsuri-ui",
+    "version": "9.7.2-alpha.0",
+    "repository": "https://github.com/matsuri-tech/matsuri-ui.git",
+    "license": "GPL-3.0",
+    "sideEffects": false,
+    "main": "dist/cjs/index.js",
+    "module": "dist/esm/index.js",
+    "types": "dist/types/index.d.ts",
+    "typings": "dist/types/index.d.ts",
+    "exports": {
+        ".": {
+            "require": "./dist/cjs/index.js",
+            "default": "./dist/esm/index.js"
+        }
+    },
+    "files": [
+        "README.md",
+        "CHANGELOG.md",
+        "dist/",
+        "package.json"
+    ],
+    "eslintIgnore": [
+        "dist",
+        "node_modules"
+    ],
+    "dependencies": {
+        "@emotion/react": "^11.4.1",
+        "@material-ui/core": "^4.12.3",
+        "@material-ui/icons": "^4.11.2",
+        "@popperjs/core": "^2.9.3",
+        "clsx": "^1.1.1",
+        "dayjs": "^1.10.6",
+        "react-spring": "^8.0.27",
+        "relative-time-format": "^1.0.5",
+        "resize-observer-polyfill": "^1.5.1"
+    },
+    "peerDependencies": {
+        "@emotion/react": "11.1.4",
+        "@popperjs/core": "2.9.2",
+        "@types/react": "17.0.19",
+        "@types/react-dom": "17.0.9",
+        "clsx": "^1.1.1",
+        "dayjs": "1.10.4",
+        "react": "17.0.2",
+        "react-dom": "17.0.2",
+        "react-spring": "8.0.27",
+        "relative-time-format": "1.0.5"
+    },
+    "devDependencies": {
+        "@babel/cli": "7.14.8",
+        "@babel/core": "7.15.0",
+        "@babel/preset-env": "7.15.0",
+        "@babel/preset-react": "7.14.5",
+        "@babel/preset-typescript": "^7.15.0",
+        "@emotion/babel-preset-css-prop": "11.2.0",
+        "@storybook/addon-essentials": "^6.3.7",
+        "@storybook/addon-links": "6.3.7",
+        "@storybook/react": "6.3.7",
+        "@testing-library/react": "12.0.0",
+        "@types/jest": "27.0.1",
+        "@types/react": "17.0.19",
+        "@types/react-dom": "17.0.9",
+        "@types/react-router": "5.1.16",
+        "@types/react-router-dom": "5.1.8",
+        "@types/react-transition-group": "4.4.2",
+        "@typescript-eslint/eslint-plugin": "4.30.0",
+        "@typescript-eslint/parser": "4.30.0",
+        "concurrently": "^6.2.1",
+        "eslint": "7.32.0",
+        "eslint-config-prettier": "8.3.0",
+        "eslint-plugin-react": "7.25.1",
+        "eslint-plugin-react-hooks": "4.2.0",
+        "eslint-plugin-sort-imports-es6-autofix": "0.6.0",
+        "husky": "^7.0.2",
+        "jest": "27.1.0",
+        "lint-staged": "11.1.2",
+        "next": "11.1.1",
+        "npm-run-all": "4.1.5",
+        "prettier": "2.3.2",
+        "react": "17.0.2",
+        "react-docgen-typescript-loader": "3.7.2",
+        "react-dom": "17.0.2",
+        "react-router": "5.2.1",
+        "react-router-dom": "5.2.1",
+        "react-table": "7.7.0",
+        "react-transition-group": "4.4.2",
+        "ress": "^4.0.0",
+        "rimraf": "3.0.2",
+        "standard-version": "9.3.1",
+        "tslib": "^2.3.1",
+        "typescript": "4.4.2"
+    },
+    "scripts": {
+        "start": "yarn clear && yarn build",
+        "clear": "rimraf .rpt2_cache .cache ./dist/*",
+        "ex:next": "next dev ./examples/next-app",
+        "build": "concurrently yarn:build:*",
+        "build:esm": "NODE_ENV=production BABEL_ENV=esm babel src --root-mode upward --extensions .ts,.tsx -d dist/esm --source-maps",
+        "build:cjs": "NODE_ENV=production BABEL_ENV=cjs babel src --root-mode upward --extensions .ts,.tsx -d dist/cjs --source-maps",
+        "build:types": "tsc -p tsconfig.build.json --emitDeclarationOnly --declaration --declarationDir dist/types",
+        "test": "jest",
+        "update": "yarn upgrade-interactive --latest",
+        "typecheck": "tsc --project tsconfig.eslint.json",
+        "lint:ts": "eslint \"src/**/*.{ts,tsx}\"",
+        "lint:js": "eslint jest.config.js --ignore-pattern .eslintrc",
+        "lint:json": "prettier '*.json'",
+        "format:ts": "yarn lint:ts --fix && prettier \"src/**/*.{ts,tsx}\" --write",
+        "format:js": "yarn lint:js --fix && prettier jest.config.js --write",
+        "format:json": "yarn lint:json --write",
+        "lint": "run-p -l -n -c --aggregate-output lint:*",
+        "format": "run-p -l -n -c --aggregate-output format:*",
+        "version": "conventional-changelog -p angular -i CHANGELOG.md -s && git add CHANGELOG.md",
+        "storybook": "start-storybook -p 6006",
+        "build-storybook": "build-storybook --quiet",
+        "release": "yarn && yarn build && standard-version && git push --follow-tags && npm publish",
+        "release:alpha": "yarn && yarn build && standard-version --prerelease alpha && git push --follow-tags && npm publish --tag alpha",
+        "prepare": "husky install",
+        "pre-commit": "lint-staged"
+    },
+    "lint-staged": {
+        "*.{js,jsx}": [
+            "yarn format:js",
+            "git add"
+        ],
+        "*.{ts,tsx}": [
+            "yarn format:ts",
+            "git add"
+        ],
+        "*.{json}": [
+            "yarn format:json",
+            "git add"
+        ]
+    }
+}