@mirohq/design-system-theme-provider 0.1.8

package/dist/main.js

@@ -0,0 +1,42 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var designSystemStitches = require('@mirohq/design-system-stitches');
+var designSystemUseTheme = require('@mirohq/design-system-use-theme');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+const ThemeProvider = ({
+  defaultTheme,
+  themes,
+  children
+}) => {
+  let themeToUse = "";
+  const { theme } = designSystemUseTheme.useTheme();
+  const defaultThemeExists = defaultTheme !== void 0 && (themes == null ? void 0 : themes[defaultTheme]) !== void 0;
+  const currentThemeExists = theme != null && (themes == null ? void 0 : themes[theme]) !== void 0;
+  if (!currentThemeExists && defaultThemeExists) {
+    console.warn("Set theme not found, setting the default theme.");
+    themeToUse = defaultTheme.toString();
+  }
+  if (!defaultThemeExists && theme == null) {
+    console.warn(
+      "Default theme not found, falling back to the Miro Design System basics."
+    );
+  }
+  if (currentThemeExists) {
+    themeToUse = theme;
+  }
+  const classNameTheme = (currentThemeExists || defaultThemeExists) && themeToUse !== "" ? designSystemStitches.createTheme(themes[themeToUse]) : "";
+  return /* @__PURE__ */ React__default["default"].createElement("div", {
+    "data-theme-provider": true,
+    className: classNameTheme
+  }, children);
+};
+
+exports.ThemeProvider = ThemeProvider;
+//# sourceMappingURL=main.js.map

package/dist/main.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"main.js","sources":["../src/theme-provider.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react'\nimport type * as themes from '@mirohq/design-system-themes'\nimport React from 'react'\nimport { createTheme } from '@mirohq/design-system-stitches'\nimport { useTheme } from '@mirohq/design-system-use-theme'\n\ninterface ThemesProp {\n  [Key: string]: Partial<typeof themes.base>\n}\n\nexport interface ThemeProviderProps<Themes extends ThemesProp = ThemesProp> {\n  /**\n   * The default theme to use if no theme is provided.\n   */\n  defaultTheme?: keyof Themes\n\n  /**\n   * Theme config for all available themes.\n   */\n  themes?: Themes\n}\n\nexport const ThemeProvider = <Themes extends ThemesProp = ThemesProp>({\n  defaultTheme,\n  themes,\n  children,\n}: PropsWithChildren<ThemeProviderProps<Themes>>): JSX.Element => {\n  let themeToUse = ''\n  const { theme } = useTheme()\n\n  const defaultThemeExists =\n    defaultTheme !== undefined && themes?.[defaultTheme] !== undefined\n\n  const currentThemeExists = theme != null && themes?.[theme] !== undefined\n\n  if (!currentThemeExists && defaultThemeExists) {\n    console.warn('Set theme not found, setting the default theme.')\n    themeToUse = defaultTheme.toString()\n  }\n\n  if (!defaultThemeExists && theme == null) {\n    console.warn(\n      'Default theme not found, falling back to the Miro Design System basics.'\n    )\n  }\n\n  if (currentThemeExists) {\n    themeToUse = theme\n  }\n\n  const classNameTheme =\n    (currentThemeExists || defaultThemeExists) && themeToUse !== ''\n      ? createTheme(themes[themeToUse])\n      : ''\n\n  return (\n    <div data-theme-provider className={classNameTheme}>\n      {children}\n    </div>\n  )\n}\n"],"names":["useTheme","createTheme","React"],"mappings":";;;;;;;;;;;;AAsBO,MAAM,gBAAgB,CAAyC;AAAA,EACpE,YAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AACF,CAAkE,KAAA;AAChE,EAAA,IAAI,UAAa,GAAA,EAAA,CAAA;AACjB,EAAM,MAAA,EAAE,KAAM,EAAA,GAAIA,6BAAS,EAAA,CAAA;AAE3B,EAAA,MAAM,kBACJ,GAAA,YAAA,KAAiB,KAAa,CAAA,IAAA,CAAA,MAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,MAAA,CAAS,YAAkB,CAAA,MAAA,KAAA,CAAA,CAAA;AAE3D,EAAA,MAAM,kBAAqB,GAAA,KAAA,IAAS,IAAQ,IAAA,CAAA,MAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,MAAA,CAAS,KAAW,CAAA,MAAA,KAAA,CAAA,CAAA;AAEhE,EAAI,IAAA,CAAC,sBAAsB,kBAAoB,EAAA;AAC7C,IAAA,OAAA,CAAQ,KAAK,iDAAiD,CAAA,CAAA;AAC9D,IAAA,UAAA,GAAa,aAAa,QAAS,EAAA,CAAA;AAAA,GACrC;AAEA,EAAI,IAAA,CAAC,kBAAsB,IAAA,KAAA,IAAS,IAAM,EAAA;AACxC,IAAQ,OAAA,CAAA,IAAA;AAAA,MACN,yEAAA;AAAA,KACF,CAAA;AAAA,GACF;AAEA,EAAA,IAAI,kBAAoB,EAAA;AACtB,IAAa,UAAA,GAAA,KAAA,CAAA;AAAA,GACf;AAEA,EAAM,MAAA,cAAA,GAAA,CACH,sBAAsB,kBAAuB,KAAA,UAAA,KAAe,KACzDC,gCAAY,CAAA,MAAA,CAAO,WAAW,CAC9B,GAAA,EAAA,CAAA;AAEN,EAAA,uBACGC,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,qBAAmB,EAAA,IAAA;AAAA,IAAC,SAAW,EAAA,cAAA;AAAA,GAAA,EACjC,QACH,CAAA,CAAA;AAEJ;;;;"}

package/dist/module.js

@@ -0,0 +1,34 @@
+import React from 'react';
+import { createTheme } from '@mirohq/design-system-stitches';
+import { useTheme } from '@mirohq/design-system-use-theme';
+
+const ThemeProvider = ({
+  defaultTheme,
+  themes,
+  children
+}) => {
+  let themeToUse = "";
+  const { theme } = useTheme();
+  const defaultThemeExists = defaultTheme !== void 0 && (themes == null ? void 0 : themes[defaultTheme]) !== void 0;
+  const currentThemeExists = theme != null && (themes == null ? void 0 : themes[theme]) !== void 0;
+  if (!currentThemeExists && defaultThemeExists) {
+    console.warn("Set theme not found, setting the default theme.");
+    themeToUse = defaultTheme.toString();
+  }
+  if (!defaultThemeExists && theme == null) {
+    console.warn(
+      "Default theme not found, falling back to the Miro Design System basics."
+    );
+  }
+  if (currentThemeExists) {
+    themeToUse = theme;
+  }
+  const classNameTheme = (currentThemeExists || defaultThemeExists) && themeToUse !== "" ? createTheme(themes[themeToUse]) : "";
+  return /* @__PURE__ */ React.createElement("div", {
+    "data-theme-provider": true,
+    className: classNameTheme
+  }, children);
+};
+
+export { ThemeProvider };
+//# sourceMappingURL=module.js.map

package/dist/module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"module.js","sources":["../src/theme-provider.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react'\nimport type * as themes from '@mirohq/design-system-themes'\nimport React from 'react'\nimport { createTheme } from '@mirohq/design-system-stitches'\nimport { useTheme } from '@mirohq/design-system-use-theme'\n\ninterface ThemesProp {\n  [Key: string]: Partial<typeof themes.base>\n}\n\nexport interface ThemeProviderProps<Themes extends ThemesProp = ThemesProp> {\n  /**\n   * The default theme to use if no theme is provided.\n   */\n  defaultTheme?: keyof Themes\n\n  /**\n   * Theme config for all available themes.\n   */\n  themes?: Themes\n}\n\nexport const ThemeProvider = <Themes extends ThemesProp = ThemesProp>({\n  defaultTheme,\n  themes,\n  children,\n}: PropsWithChildren<ThemeProviderProps<Themes>>): JSX.Element => {\n  let themeToUse = ''\n  const { theme } = useTheme()\n\n  const defaultThemeExists =\n    defaultTheme !== undefined && themes?.[defaultTheme] !== undefined\n\n  const currentThemeExists = theme != null && themes?.[theme] !== undefined\n\n  if (!currentThemeExists && defaultThemeExists) {\n    console.warn('Set theme not found, setting the default theme.')\n    themeToUse = defaultTheme.toString()\n  }\n\n  if (!defaultThemeExists && theme == null) {\n    console.warn(\n      'Default theme not found, falling back to the Miro Design System basics.'\n    )\n  }\n\n  if (currentThemeExists) {\n    themeToUse = theme\n  }\n\n  const classNameTheme =\n    (currentThemeExists || defaultThemeExists) && themeToUse !== ''\n      ? createTheme(themes[themeToUse])\n      : ''\n\n  return (\n    <div data-theme-provider className={classNameTheme}>\n      {children}\n    </div>\n  )\n}\n"],"names":[],"mappings":";;;;AAsBO,MAAM,gBAAgB,CAAyC;AAAA,EACpE,YAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AACF,CAAkE,KAAA;AAChE,EAAA,IAAI,UAAa,GAAA,EAAA,CAAA;AACjB,EAAM,MAAA,EAAE,KAAM,EAAA,GAAI,QAAS,EAAA,CAAA;AAE3B,EAAA,MAAM,kBACJ,GAAA,YAAA,KAAiB,KAAa,CAAA,IAAA,CAAA,MAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,MAAA,CAAS,YAAkB,CAAA,MAAA,KAAA,CAAA,CAAA;AAE3D,EAAA,MAAM,kBAAqB,GAAA,KAAA,IAAS,IAAQ,IAAA,CAAA,MAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,MAAA,CAAS,KAAW,CAAA,MAAA,KAAA,CAAA,CAAA;AAEhE,EAAI,IAAA,CAAC,sBAAsB,kBAAoB,EAAA;AAC7C,IAAA,OAAA,CAAQ,KAAK,iDAAiD,CAAA,CAAA;AAC9D,IAAA,UAAA,GAAa,aAAa,QAAS,EAAA,CAAA;AAAA,GACrC;AAEA,EAAI,IAAA,CAAC,kBAAsB,IAAA,KAAA,IAAS,IAAM,EAAA;AACxC,IAAQ,OAAA,CAAA,IAAA;AAAA,MACN,yEAAA;AAAA,KACF,CAAA;AAAA,GACF;AAEA,EAAA,IAAI,kBAAoB,EAAA;AACtB,IAAa,UAAA,GAAA,KAAA,CAAA;AAAA,GACf;AAEA,EAAM,MAAA,cAAA,GAAA,CACH,sBAAsB,kBAAuB,KAAA,UAAA,KAAe,KACzD,WAAY,CAAA,MAAA,CAAO,WAAW,CAC9B,GAAA,EAAA,CAAA;AAEN,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,qBAAmB,EAAA,IAAA;AAAA,IAAC,SAAW,EAAA,cAAA;AAAA,GAAA,EACjC,QACH,CAAA,CAAA;AAEJ;;;;"}

package/dist/types.d.ts

@@ -0,0 +1,19 @@
+import { PropsWithChildren } from 'react';
+import * as themes from '@mirohq/design-system-themes';
+
+interface ThemesProp {
+    [Key: string]: Partial<typeof themes.base>;
+}
+interface ThemeProviderProps<Themes extends ThemesProp = ThemesProp> {
+    /**
+     * The default theme to use if no theme is provided.
+     */
+    defaultTheme?: keyof Themes;
+    /**
+     * Theme config for all available themes.
+     */
+    themes?: Themes;
+}
+declare const ThemeProvider: <Themes extends ThemesProp = ThemesProp>({ defaultTheme, themes, children, }: PropsWithChildren<ThemeProviderProps<Themes>>) => JSX.Element;
+
+export { ThemeProvider, ThemeProviderProps };

package/package.json

@@ -0,0 +1,42 @@
+{
+  "name": "@mirohq/design-system-theme-provider",
+  "version": "0.1.8",
+  "author": "Miro",
+  "source": "src/index.ts",
+  "main": "dist/main.js",
+  "module": "dist/module.js",
+  "types": "dist/types.d.ts",
+  "sideEffects": false,
+  "exports": {
+    ".": {
+      "require": "./dist/main.js",
+      "import": "./dist/module.js",
+      "types": "./dist/types.d.ts"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "peerDependencies": {
+    "@stitches/react": "^1.2.8",
+    "react": "^16.14 || ^17"
+  },
+  "dependencies": {
+    "@mirohq/design-system-stitches": "^2.0.8",
+    "@mirohq/design-system-themes": "^0.1.5",
+    "@mirohq/design-system-use-theme": "^0.1.0",
+    "@mirohq/design-system-types": "^0.2.0"
+  },
+  "devDependencies": {
+    "@mirohq/design-system-button": "^2.0.11",
+    "@mirohq/design-system-box": "^2.0.9"
+  },
+  "scripts": {
+    "build": "rollup -c ../../../rollup.config.js",
+    "clean": "rm -rf dist",
+    "prebuild": "pnpm clean"
+  }
+}