@opengeoweb/theme 2.0.0 → 2.1.2

package/lib/components/Theme/types.d.ts

@@ -0,0 +1,121 @@
+/// <reference types="react" />
+interface CSSProperties extends React.CSSProperties {
+    rgba?: string;
+}
+export declare type GeowebColorPalette = {
+    background: {
+        surface: CSSProperties['color'];
+        surfaceApp: CSSProperties['color'];
+        surfaceBrowser: CSSProperties['color'];
+    };
+    brand: {
+        brand: CSSProperties['color'];
+    };
+    buttons: {
+        primary: CSSProperties;
+        primaryMouseover: CSSProperties;
+        primaryActive: CSSProperties;
+        flatMouseover: CSSProperties;
+        focusDefault: CSSProperties;
+        disabled: CSSProperties;
+        surfaceIconDefault: CSSProperties;
+    };
+    typographyAndIcons: {
+        text: CSSProperties['color'];
+        icon: CSSProperties['color'];
+        buttonIcon: CSSProperties['color'];
+        iconLinkActive: CSSProperties['color'];
+        iconLinkDisabled: CSSProperties['color'];
+        textLinkActive: CSSProperties['color'];
+        buttonIconTertiaryFlat: CSSProperties['color'];
+    };
+    textInputField: {
+        default: CSSProperties;
+        active: CSSProperties;
+        disabled: CSSProperties;
+    };
+    tab: {
+        mouseOver: CSSProperties;
+    };
+    greys: {
+        accessible: CSSProperties['color'];
+    };
+    cards: {
+        cardContainer: CSSProperties['color'];
+        cardContainerBorder?: CSSProperties['color'];
+    };
+    backdrops: {
+        black: CSSProperties;
+        white: CSSProperties;
+    };
+    timeSlider: {
+        playerNeedleTimeTop: CSSProperties;
+        playerNeedleTime: CSSProperties;
+        playerNeedlePlayerTop: CSSProperties;
+        playerNeedlePlayer: CSSProperties;
+        playerRailObservation: CSSProperties;
+        playerRailSelection: CSSProperties;
+        playerRailForecastData: CSSProperties;
+        playerRailForecastNoData: CSSProperties;
+        playerTimeMarkers: CSSProperties;
+        playerTimeText: CSSProperties;
+        timelineIndicator: CSSProperties;
+        timelineText: CSSProperties;
+        timelineTimeScale: CSSProperties;
+        timelineNightTime: CSSProperties;
+        timelineTimelineSurface: CSSProperties;
+        timelineMonthChangeDash: CSSProperties;
+        timeScaleText: CSSProperties;
+        timeScalePointer: CSSProperties;
+        timeScaleHorizontalScale: CSSProperties;
+        timeScaleTimeIndicators: CSSProperties;
+        timeScaleTimeIndicatorsActive: CSSProperties;
+        timeScaleShadowButtonScale: CSSProperties;
+    };
+    customSlider: {
+        rail: CSSProperties['color'];
+        railDisabled: CSSProperties['color'];
+        track: CSSProperties['color'];
+        trackDisabled: CSSProperties['color'];
+        thumb: CSSProperties['color'];
+        thumbDisabled: CSSProperties['color'];
+        mark: CSSProperties['color'];
+        markDisabled: CSSProperties['color'];
+        switchTrack: CSSProperties['color'];
+        switchTrackDisabled: CSSProperties['color'];
+    };
+    syncGroups: {
+        drawerOpen: CSSProperties;
+    };
+    layerManager: {
+        tableRowDefaultIcon: CSSProperties;
+        tableRowDefaultText: CSSProperties;
+        tableRowDefaultCardContainer: CSSProperties;
+        tableRowMouseover: CSSProperties;
+        tableRowDisabledIcon: CSSProperties;
+        tableRowDisabledText: CSSProperties;
+        tableRowDisabledCardContainer: CSSProperties;
+    };
+    tooltips: {
+        tooltipContainer: CSSProperties;
+        tooltipText: CSSProperties;
+    };
+    captions: {
+        captionStatus: CSSProperties;
+        captionInformation: CSSProperties;
+        captionError: CSSProperties;
+        captionDisabled: CSSProperties;
+    };
+};
+export declare type Elevations = {
+    [id: string]: string;
+};
+declare module '@material-ui/core/styles/createPalette' {
+    interface Palette {
+        geowebColors: GeowebColorPalette;
+    }
+    interface PaletteOptions {
+        geowebColors: GeowebColorPalette;
+    }
+}
+export {};

package/lib/components/Theme/utils.d.ts

@@ -0,0 +1,7 @@
+import { Theme, PaletteType } from '@material-ui/core';
+import { Shadows } from '@material-ui/core/styles/shadows';
+import { Elevations, GeowebColorPalette } from './types';
+export declare const hex2rgba: (hex: string, alpha?: number) => string;
+export declare const parseColors: (colors: GeowebColorPalette) => GeowebColorPalette;
+export declare const createShadows: (elevations: Elevations) => Shadows;
+export declare const createTheme: (paletteType: PaletteType, geowebColors: GeowebColorPalette, shadows: Shadows) => Theme;

package/lib/components/Theme/utils.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/stories/Backdrop.stories.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+interface BackdropDemoProps {
+    isOpen?: boolean;
+}
+export declare const BackdropDemo: React.FC<BackdropDemoProps>;
+export declare const Backdrop: React.FC;
+export {};

package/lib/stories/Card.stories.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const CardDemo: React.FC;
+export declare const Cards: React.FC;

package/lib/stories/Colors.stories.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+interface ColorsDemoProps {
+    showSourceCode?: boolean;
+}
+export declare const ColorsDemo: React.FC<ColorsDemoProps>;
+export declare const Colors: React.FC;
+export {};

package/lib/stories/Elevation.stories.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const ElevationDemo: React.FC;
+export declare const Elevation: React.FC;

package/lib/stories/FormElements.stories.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+export declare const FormElementsDemo: React.FC;
+export declare const FormElementsGWTheme: React.FC;
+export declare const FormElements: React.FC;

package/lib/stories/List.stories.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const ListDemo: React.FC;
+export declare const List: React.FC;

package/lib/stories/Slider.stories.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const SliderDemo: React.FC;
+export declare const Slider: React.FC;

package/lib/stories/StoryWrapper.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+interface StoryLayoutProps {
+    children: React.ReactNode;
+    title: string;
+    linkToLightThemeDesign?: string;
+    linkToDarkThemeDesign?: string;
+}
+export declare const StoryWrapper: React.FC<StoryLayoutProps>;
+export {};

package/lib/stories/Table.stories.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const TableDemo: React.FC;
+export declare const Table: React.FC;

package/lib/stories/Tabs.stories.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+interface TabsDemoProps {
+    value?: number;
+    onChange?: (event: React.ChangeEvent, index: number) => void;
+}
+export declare const TabsDemo: React.FC<TabsDemoProps>;
+export declare const Tabs: React.FC;
+export {};

package/lib/stories/Tooltip.stories.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const TooltipDemo: React.FC;
+export declare const Tooltips: React.FC;

package/lib/stories/Typography.stories.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+export declare const TypographyDemo: React.FC;
+export declare const TypographyGWTheme: React.FC;
+export declare const Typography: React.FC;

package/lib/stories/index.stories.d.ts

@@ -0,0 +1,15 @@
+export { Backdrop } from './Backdrop.stories';
+export { Cards } from './Card.stories';
+export { Colors } from './Colors.stories';
+export { Elevation } from './Elevation.stories';
+export { List } from './List.stories';
+export { Slider } from './Slider.stories';
+export { Table } from './Table.stories';
+export { Tabs } from './Tabs.stories';
+export { Typography, TypographyGWTheme } from './Typography.stories';
+export { Tooltips } from './Tooltip.stories';
+export { FormElementsGWTheme, FormElements } from './FormElements.stories';
+declare const _default: {
+    title: string;
+};
+export default _default;

package/lib/stories/snapshots/Backdrop.stories.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const BackDropLight: {
+    (): React.ReactElement;
+    parameters: {
+        layout: string;
+    };
+};
+export declare const BackDropDark: {
+    (): React.ReactElement;
+    parameters: {
+        layout: string;
+    };
+};

package/lib/stories/snapshots/Card.stories.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const CardLight: {
+    (): React.ReactElement;
+    parameters: {
+        layout: string;
+    };
+};
+export declare const CardDark: {
+    (): React.ReactElement;
+    parameters: {
+        layout: string;
+    };
+};

package/lib/stories/snapshots/Colors.stories.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const ColorsLight: {
+    (): React.ReactElement;
+    parameters: {
+        layout: string;
+    };
+};
+export declare const ColorsDark: {
+    (): React.ReactElement;
+    parameters: {
+        layout: string;
+    };
+};

package/lib/stories/snapshots/Elevation.stories.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const ElevationLight: {
+    (): React.ReactElement;
+    parameters: {
+        layout: string;
+    };
+};
+export declare const ElevationDark: {
+    (): React.ReactElement;
+    parameters: {
+        layout: string;
+    };
+};

package/lib/stories/snapshots/FormElements.stories.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const FormElementsLight: () => React.ReactElement;
+export declare const FormElementsDark: () => React.ReactElement;

package/lib/stories/snapshots/List.stories.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const ListLight: () => React.ReactElement;
+export declare const ListDark: () => React.ReactElement;

package/lib/stories/snapshots/Slider.stories.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const SliderLight: () => React.ReactElement;
+export declare const SliderDark: () => React.ReactElement;

package/lib/stories/snapshots/Table.stories.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const TableLight: {
+    (): React.ReactElement;
+    parameters: {
+        layout: string;
+    };
+};
+export declare const TableDark: {
+    (): React.ReactElement;
+    parameters: {
+        layout: string;
+    };
+};

package/lib/stories/snapshots/Tabs.stories.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const TabsLight: () => React.ReactElement;
+export declare const TabsDark: () => React.ReactElement;

package/lib/stories/snapshots/Tooltip.stories.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const TooltipDemoLight: {
+    (): React.ReactElement;
+    parameters: {
+        layout: string;
+    };
+};
+export declare const TooltipDemoDark: {
+    (): React.ReactElement;
+    parameters: {
+        layout: string;
+    };
+};

package/lib/stories/snapshots/Typography.stories.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const TypographyLight: () => React.ReactElement;
+export declare const TypographyDark: () => React.ReactElement;

package/lib/storyshots/Storyshots.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,130 +1,20 @@
 {
   "name": "@opengeoweb/theme",
-  "version": "2.0.0",
+  "version": "2.1.2",
   "description": "GeoWeb Theme library for the opengeoweb project",
+  "license": "Apache-2.0",
   "repository": {
     "type": "git",
-    "url": "git@gitlab.com:opengeoweb/geoweb-theme.git"
+    "url": "git@gitlab.com:opengeoweb/opengeoweb.git"
   },
-  "_main": "./dist/index.js",
-  "module": "./src/js/index.js",
-  "types": "./dist/index.d.js",
-  "dependencies": {
-    "@material-ui/core": "^4.9.8",
-    "@material-ui/icons": "^4.9.1",
+  "main": "./theme.umd.js",
+  "module": "./theme.esm.js",
+  "typings": "./index.d.ts",
+  "dependencies": {},
+  "peerDependencies": {
+    "@material-ui/core": "^4.11.0",
     "@material-ui/lab": "^4.0.0-alpha.56",
-    "@material-ui/pickers": "^3.2.10",
-    "core-js": "^3.6.5",
-    "react": "^16.9.0",
-    "react-dom": "^16.9.0"
-  },
-  "resolutions": {
-    "minimist": "1.2.5"
-  },
-  "license": "Apache-2.0",
-  "scripts": {
-    "build": "npm run babel",
-    "clean": "rm -rf dist lib node_modules",
-    "storybook": "start-storybook -p 6006",
-    "build-storybook": "build-storybook -c .storybook -o storybook-opengeoweb-theme",
-    "test": "jest",
-    "test:coverage": "jest  --coverage",
-    "prettier": "prettier 'src/**/*.+(js|jsx|ts|tsx)' 'stories/**/*.+(js|jsx|ts|tsx)' --check",
-    "prettier:fix": "prettier 'src/**/*.+(js|jsx|ts|tsx)' 'stories/**/*.+(js|jsx|ts|tsx)' --write",
-    "lint": "eslint '*/**/*.{ts,tsx,js,jsx}'",
-    "lint:fix": "eslint '*/**/*.{ts,tsx,js,jsx}' --fix",
-    "typecheck": "tsc",
-    "docs": "typedoc --out docs src",
-    "generate-types-internal": "tsc --project tsconfig.d.json --outDir ./lib",
-    "generate-types": "rm -rf ./lib && npm run generate-types-internal",
-    "babel": "rm -rf lib && babel src --out-dir lib --extensions '.ts,.tsx,.js,.jsx' && cp package.json LICENCE AUTHORS README.md lib",
-    "webpack": "webpack --mode development --display-modules",
-    "package": "npm run babel && npm run generate-types-internal && npm pack ./lib",
-    "prepublishOnly": "npm ci && npm run babel && npm run generate-types-internal && npm pack ./lib",
-    "publish": "npm publish ./lib --access public",
-    "licence:check": "license-check-and-add check -f './licence.config.json'",
-    "licence:add": "license-check-and-add add -f './licence.config.json'",
-    "licence:remove": "license-check-and-add remove -f './licence.config.json'",
-    "postversion": "git push --tags && git push"
-  },
-  "_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"
-    ]
-  },
-  "devDependencies": {
-    "@babel/cli": "^7.8.4",
-    "@babel/core": "^7.8.4",
-    "@babel/plugin-proposal-class-properties": "^7.8.3",
-    "@babel/polyfill": "^7.0.0",
-    "@babel/preset-env": "^7.0.0",
-    "@babel/preset-react": "^7.0.0",
-    "@babel/preset-typescript": "^7.10.4",
-    "@babel/register": "^7.6.2",
-    "@storybook/addon-actions": "^6.0.21",
-    "@storybook/addon-console": "^1.2.1",
-    "@storybook/addon-jest": "^6.0.21",
-    "@storybook/addon-links": "^6.0.21",
-    "@storybook/addon-storyshots": "^6.0.21",
-    "@storybook/addon-storysource": "^6.0.21",
-    "@storybook/addons": "^6.0.21",
-    "@storybook/react": "^6.0.21",
-    "@testing-library/react": "^10.4.5",
-    "@testing-library/react-hooks": "^3.3.0",
-    "@types/jest": "^25.2.3",
-    "@types/node": "12.7.1",
-    "@types/react": "^16.9.21",
-    "@types/react-dom": "16.8.5",
-    "@typescript-eslint/eslint-plugin": "^2.18.0",
-    "@typescript-eslint/parser": "^2.18.0",
-    "autoprefixer": "latest",
-    "awesome-typescript-loader": "^5.2.1",
-    "babel-core": "^7.0.0-bridge.0",
-    "babel-eslint": "^10.0.3",
-    "babel-loader": "^8.0.6",
-    "babel-polyfill": "^6.26.0",
-    "babel-register": "^6.26.0",
-    "copy-webpack-plugin": "^6.0.4",
-    "enzyme": "^3.11.0",
-    "enzyme-adapter-react-16": "^1.15.2",
-    "enzyme-to-json": "^3.4.3",
-    "eslint": "^6.8.0",
-    "eslint-config-airbnb": "^18.0.1",
-    "eslint-config-airbnb-typescript": "^6.3.1",
-    "eslint-config-prettier": "^6.10.0",
-    "eslint-plugin-import": "^2.20.1",
-    "eslint-plugin-jest": "^23.6.0",
-    "eslint-plugin-jsx-a11y": "^6.2.3",
-    "eslint-plugin-prettier": "^3.1.2",
-    "eslint-plugin-react": "^7.18.3",
-    "eslint-plugin-react-hooks": "^1.7.0",
-    "eslint-plugin-testing-library": "^3.3.1",
-    "file-loader": "^6.0.0",
-    "html-loader": "^0.5.5",
-    "jest": "^25.1.0",
-    "jest-css-modules": "^2.1.0",
-    "license-check-and-add": "^3.0.4",
-    "mini-css-extract-plugin": "^0.9.0",
-    "node-sass": "^4.12.0",
-    "prettier": "^1.19.1",
-    "react-docgen-typescript-loader": "^3.3.0",
-    "regenerator-runtime": "^0.13.3",
-    "require-context.macro": "^1.2.2",
-    "typedoc": "^0.16.11",
-    "typescript": "^3.7.5",
-    "webpack": "^4.41.5",
-    "webpack-cli": "^3.3.10",
-    "webpack-dev-server": "^3.10.1",
-    "webpack-node-externals": "^1.7.2"
+    "react": "16.14.0",
+    "@material-ui/icons": "^4.9.1"
   }
 }